@petrfedorav

Как зафиксировать сайт, чтобы он не скролился пальцем вправо-влево на телефоне, оголяя белый фон?

Сделал простой сайт лендинг. Он адаптивный и нормально работает на любых экранах.

Проблема в том, что на телефоне или планшете его можно пальцем поскролить горизонтально, хотя вся информация отлично помещается без скрола, а там открывается просто белый фон. Получается что сайт "болтается вправо-влево" при обычном вертикальном скроле пальцем, когда скролишь небрежно, не строго вертикально.

Как решить эту проблему?
Правильно ли я понимаю, что будет достаточно запретить горизонтальную прокрутку на тач скрине? Как это сделать?
  • Вопрос задан
  • 5635 просмотров
Решения вопроса 1
sevirinov
@sevirinov
Web Developer
Видимо какой то элемент имеет отрицательное горизонтальное значение.
Два варианта решения:
  1. найти этот элемент и исправить
  2. добавить родителю с элементов который выходит за грани CSS overflow-x: hidden; или, если не удается найти/исправить вышеуказанный элемент, добавить это правило в body
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
dpmango
@dpmango
body, html{
  max-width: 100%;
}


Если все таки что то вылазает, можно попробовать 100vw

По предложению KorniloFF можно еще добавить
body, html {
  overflow-x: hidden;
}
Ответ написан
Ваш ответ на вопрос

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

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