Загадка адаптивной (не резиновой) верстки, как решить?

Question

[Evgeny K]

Здравствуйте есть смартфон huawei honor 4c, разрешение которого в заявленных характеристиках 720 х 1280, но как только с этого смартфона браузером chrome я попадаю на страницу для теста своего разрешения, то он показывает 360 на 615 - разрешение браузера.

Это нормально?

Может это связано с dpi? Для меня это загадка, пробел так сказать, я не понимаю и это пугает

Просто когда я пишу медиа запросы я руководствуюсь заявленными характеристиками и под них пишу медиа запросы, а на деле получается иное.

Я использую:

<meta name="viewport" content="width=device-width, initial-scale=1">

Захожу на сайт, при книжной ориентации все нормально все расположено в одну колонку, а вот в альбомной ориентации, все расположено по прежнему в одну колонку, хотя я писал под 2.

Встает вопрос как быть?

Как сделать что бы смартфон показывал разрешение какое должно быть
Или угадывать разрешение для каждого такого устройства, каким оно будет. и писать под него медиа запрос.

Comments

[Сергей delphinpro]

У вас экран с увеличенной плотностью пикселей. Типа ретина. В характеристиках указано количество физических пикселей.

Answer 1

[Evgeny K]

media screen and (max-device-width: 480px) - считает от разрешения экрана смартфона
media screen and (max-width: 480px)- считает от разрешения браузера
Вот в чем был секрет

Answer 2

[Алекс Глебов]

верстка не подстраивается под конкретное устроиство, она должна выглядеть нормально на всех.

v4-alpha.getbootstrap.com/layout/overview
у бутстрапа удобные брекпоинты
5 конрольных точек, между ними ширина контейнера фиксированна и он отцентрован, т.е дополнительные медиа не нужны.
А телефоны сами выберут себе нужную ширину