адаптивный фон в div

Тема в разделе "Верстка", создана пользователем riccco, 3 дек 2014.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Статус темы:
Закрыта.
Модераторы: ultra
  1. riccco

    riccco Создатель

    Регистр.:
    16 дек 2012
    Сообщения:
    35
    Симпатии:
    3
    Здравствуйте, честно скажу, версткой занимаюсь совсем не долго, по этому не хватает знаний для выполнения задачи, прошу помощи в адекватном решение :glob:

    Задача в следующая в рабочей области div слайдер + кликабельные доп. изображения, максимальным размером 980px (выделена красным цветом) и есть background который растягивается при разрешения свыше 980px (стрелочки синим цветом). Нужно сделать так чтобы фон при разрешении 980px и ниже исчезал типо display:none или подменялся #fff. Скриншот№1

    Прошу помощи как это можно осуществить, а то получается так что небольших разрешениях фон сжимается как видно на скриншоте№2 :conf:
     
  2. Solus_Rex

    Solus_Rex

    Регистр.:
    15 янв 2012
    Сообщения:
    425
    Симпатии:
    182
    Код:
    [html]
    <div class="qqq">тут текст</div>
    [css]
    
      body { background: #A3B73A; }
      @media screen and (max-width: 980px) {
      body { background: #EA6E40; }
      }
    .qqq {
      width: 800px;
      margin:0 auto;
      text-align: justify;
    }
    
    http://codepen.io/Solus_Rex/pen/jEbdPP

    Только вместо цвета #A3B73A вставьте свою картинку.
    А оранжевый цвет можно выхерачить в "none".
    Удачи.
     
    Последнее редактирование: 4 дек 2014
    riccco нравится это.
  3. vytyacom

    vytyacom Постоялец

    Регистр.:
    19 ноя 2014
    Сообщения:
    136
    Симпатии:
    55
    Solus_Rex подсказал решение, только возможно стоит убирать бг при разрешении больше 980 пксл, т.к. судя по скринам будут разрешения при которых бг будет так сказать обрезан. В общем редактируется изменением "max-width: 980px"
     
  4. riccco

    riccco Создатель

    Регистр.:
    16 дек 2012
    Сообщения:
    35
    Симпатии:
    3
    проверю отпишусь о варианте решения
     
    Последнее редактирование: 11 дек 2014
Статус темы:
Закрыта.