media-queris проблема с низкими разрешениями

Проблема пустяковая, но всё же очень тормозит процесс. Дело в том, что media-queris на разрешениях экрана до 500px сразу применяются, а media-queris на 320px очень долго или вообще не применяется. В чём может быть причина?


Ответы (1 шт):

Автор решения: Quazimorda

Раз вы хотите, чтобы при меньшем значении ширины окна у вас менялись стили, то медиа-запросы следует указывать в порядке уменьшения ширины. Как-нибудь так:

media only screen and (max-width: 700px) {
  #test {
    color: green;
  }
}

media only screen and (max-width: 576px) {
  #test {
    color: red;
  }
}
→ Ссылка