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

[kussi]

Здравствуйте.

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

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

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


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

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

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

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


Как можно сделать так, чтобы эти стили отключались при сужении экрана и картинка просто была над текстом?

 

[ddn128]

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

 

[kussi]

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

Я вас люблю))

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

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

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

Огромное спасибо!

 

[eskadu]

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