FreeTibet
@FreeTibet
dharma supplier

Почему MEDIA CSS не правильно определяют разрешение телефона?

Во такой код:
@media all and (max-width: 720px) {
  .apt-short-card {
      border-top: 2px solid red !important;
  }
}

@media all and (max-width: 566px) {
.apt-short-card {
      border-top: 2px solid blue !important;
} 
}


дает ожидаемое поведение в эмуляторе хрома
1) если разрешение 720 или меньше подсвечиваем верхний бордер красным
2) если разрешение 566 или меньше подсвечиваем верхний бордер синим

Но на телефоне c разрешением 720px, я получаю работающее правило №2.
Как так получается? Спасибо.
  • Вопрос задан
  • 188 просмотров
Пригласить эксперта
Ответы на вопрос 3
Aligatro
@Aligatro
Turn food and coffee into software...
Первое - вы не забыли поставить:
<meta name="viewport" content="width=device-width, initial-scale=1.0">

А во вторых - https://mydevice.io/devices/
Ответ написан
Rema1ns
@Rema1ns
и так сойдет
Есть такое дело, в браузерах мобильного телефона разрешение не соответствует разрешению экрана телефона.

Например в айпэде с ретина дисплеем разрешение 1024 на 768, сами понимаете что на матрице у него 2048×1536
Ответ написан
LenovoId
@LenovoId
I want, women not to get sick
https://codepen.io/simkaUser/pen/YrZgWX?editors=1100 вроде бы корректно всё отображается ...
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы