Почему overflow-x:hidden не срабатывает на мобильных?

Чтоб протянуть фон блока за пределы центрального контейнера использую такую конструкцию.
body {
      overflow-x:hidden
}
.test {
      position:relative
}
.test:before {
      content: '';
      width: 1000rem;
      height: 520rem;
      position: absolute;
      top: 0;
      right: -1000rem;
}

Это прекрасно работает на десктопе, но на мобильных прокрутка не исчезает.
В чём проблема?
  • Вопрос задан
  • 4892 просмотра
Решения вопроса 1
Serj-One
@Serj-One
i'm sexy and i know it
Мобильные браузеры игнорируют overflow-x:hidden для html и body при использовании <meta name="viewport">
Проблема решается добавлением этого свойства отдельным секциям.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
djstanislaff
@djstanislaff
Начинающий веб-разработчик, верстальщик
Так же, при установке не срабатывает:
body {
      overflow-x: hidden;
}


Но при установке совместно с html - неожиданно сработало
html, body {
      overflow-x: hidden;
}
Ответ написан
mufenman
@mufenman
пытаюсь кодить на стороне клиента
overflov-x:hidden - синтаксическая ошибка overflow и еще может мобильный браузер не знать overflow-x и еще используй просто
body {
      overflow: hidden
 max-width: 100%
}

или смотря какую ширину нужно
Ответ написан
Ваш ответ на вопрос

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

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