@irvdev
Учусь

Проблемы с height: 100vh на мобильном. Как решить?

Всем привет!
Использовал height: 100vh уже давно. Но на мобильных есть некоторая проблема.
Если листать верстку вниз то в мобильном браузере скрывается адресная строка. В следствии чего высота экрана увеличивается на несколько пикселей. Из за этого блок с height: 100vh увеличивается на эти пиксели. И получается некоторое дерганье верстки.
А если начать листать вверх, то адресная строка снова появляется и и все обратно передвигается.

Очень не хочется такую верстку в продакшн отдавать.

Может кто в курсе как такое решить? Спасибо.
  • Вопрос задан
  • 7413 просмотров
Решения вопроса 1
@artem_music
Еще есть нюанс, что в айпэде 100% высоты - это высота до панели вкладок, а 100vh - это высота с учетом пространства под ними :)

Один вариант - делать общий враппер с 100% высоты и от этого исходить уже, по крайней мере я так решал эту проблему
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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