Задать вопрос
t-alexashka
@t-alexashka
Сразу пишу legacy код
html

Как убрать смещение страницы влево при появлении полосы прокрутки?

Добрый день всем.

При динамическом обновлении таба, высота меняется, из за чего появляется прокрутка (вертикальная) в браузере, и страница немного смещается влево на ширину прокрутки. как бы так сделать чтобы прокрутка не влияла на разметку?

Спасибо.
  • Вопрос задан
  • 26584 просмотра
Комментировать
Подписаться 3 Сложный Комментировать
Решения вопроса 1
Pongo
@Pongo
При помощи calc(100vw - 100%) можно вычислить ширину скроллбара (а если он не отображается, то будет 0). Идея: при помощи отрицательного margin-right увеличить ширину <html> на эту ширину. При этом появляется горизонтальная полоса прокрутки — ее скрываем.

html {
  overflow-x: hidden;
  margin-right: calc(-1 * (100vw - 100%));
}

Пример. Нажатие кнопки "change min-height" скрывает\отображает скроллбар.
Ответ написан
12 комментариев
12 комментариев
Пригласить эксперта
Ответы на вопрос 3
7GIT
@7GIT 
html {
    width:100vw;
    overflow-x:hidden;
}
Ответ написан
2 комментария
2 комментария
chesterOk
@chesterOk
Как вариант, можно отображать полосу прокрутки постоянно.

body {
  overflow-y: visible;
}
Ответ написан
3 комментария
3 комментария
Aligatro
@Aligatro
Turn food and coffee into software...
Без примера сказать сложно, но попробуйте overflow-x:hidden добавить к блоку.
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

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

Похожие вопросы
Вакансии с Хабр Карьеры
Fullstack Developer под Wordpress
Future Search
от 90 000 до 150 000 ₽
WordPress-разработчик
div. • Ставрополь
от 50 000 до 120 000 ₽
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Перерисовать логотип в векторе
22 нояб. 2024, в 00:55
500 руб./за проект
Разработка алгоритма на python (Data engineering)
21 нояб. 2024, в 23:30
300000 руб./за проект
Верстка Flutter + API
21 нояб. 2024, в 22:21
3000 руб./в час
Ещё заказы