Помощь Как отключить стили при сужении экрана или входе с мобильного?

kussi

Постоялец
Регистрация
15 Май 2014
Сообщения
60
Реакции
0
Здравствуйте.

На шаблоне (JA Playmag) отлично отображается мобильная версия. Я создала в описании категории свои стили, и теперь на мобильной версии они тоже срабатывают и это очень некрасиво(

Получается вот что я сделала в описании:

Код:
<div class="1">
     <div class="2">Картинка</div>
     <div class="3">Текст </div>
</div>


И добавила такие стили:

.2 {
  float: left;
  width: 30%;
}

.3 {
  float: left;
  width: 70%;
}


Получилось все как задумано, картинка слева а текст справа и не обтекает картинку. Но если открывать с мобильного, это тоже работает(


Как можно сделать так, чтобы эти стили отключались при сужении экрана и картинка просто была над текстом?
 
Последнее редактирование:
При помощи media-запросов. Т.е. указать при каком диапазоне расширений стили вкл, а при каком откл. - Для просмотра ссылки Войди или Зарегистрируйся
 
При помощи media-запросов. Т.е. указать при каком диапазоне расширений стили вкл, а при каком откл. - Для просмотра ссылки Войди или Зарегистрируйся

Я вас люблю))

Все получилось, сделала вот так:

Код:
@media screen and (max-width: 600px) {
Тут нужные стили
}

И при размере меньше 600 px срабатывают уже эти стили!

Огромное спасибо!
 
Лучше сделайте не 600px, а @media (max-width: 767px)
так как большинство шаблонов переходят на мобильною версию при разрешении меньше 767px
 
Назад
Сверху