Сейчас строит задача адаптировать сайт под мобильный. HTML сейчас сырой без фрейморков. Пишут в туториалах что начинать надо с
, но при добавлении этого тега все становится узким под 360 пк (
window.width
равно 360) т. е. сайт отображается в левой половине мобильного. Как это работает? Я так понимаю проблема в том, что ширина экрана 360, но разрешение выше в 2 раза (iPhone 6, LG g4).
Как исправить?
И я так понимаю тут надо 2 варианта учитывать, когда разрешение выше (iPhone 6, LG g4) и когда разрешение равно размеру экрана.
Какие еще шаги для адаптации надо проделать?
- background-size для картинок
- Адаптировать шрифты
- Положение блоков
Что еще?
PS. Вот заметил что главный wrapper
имел width=100%
. Если я его убираю, то все тянет по ширине как и надо на физическом девайсе. Но ведь мне надо задать 94% чтоб был отступ. А вот отладчик хрома ведет себя иначе. Выбираю iPhone 6 пишет что Device Pixel Ratio =2. Но ведет себя как будто 1.