0

Только начал в медиа запросы:

@media screen and (max-width: 978px) {
  #adaptive {
    background-color: red;
  }
}

Если ставлю меньше чем 979px (!), страница перестает реагировать на правило. Т.е. я хочу поставить например max-width: 500px, но это не работает, работает от 979+.

Создавал новую страницу - с чистого листа, на один блок - то же самое. хелп

1
  • "Если ставлю меньше чем 979px (!)" - где именно и что именно Вы ставите? Покажите весь ваш код (с html), а лучше сделайте воспроизводимый пример Commented 11 февр. 2020 в 9:32

2 ответа 2

1

так же проверь meta viewport

<meta name="viewport" content="width=device-width, initial-scale=1">
1
  • Спасибо, помогло! Странно, что на ютубе это никто не упоминал.
    – Anton Klip
    Commented 11 февр. 2020 в 12:04
1

Если ставлю меньше чем 979px (!), страница перестает реагировать на правило. Т.е. я хочу поставить например max-width: 500px, но это не работает, работает от 979+.

Страница не может не реагировать на правило. Смотрите пример ниже. Вероятнее всего, где-то у вас ошибка.

#adaptive {
  width: 100%;
  height: 100vh;
  background-color: chocolate;
}

@media screen and (max-width: 978px) {
  #adaptive {
    background-color: pink;
  }
}

@media screen and (max-width: 500px) {
  #adaptive {
    background-color: red;
  }
}
<div id="adaptive"></div>

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.