Как убрать сдвиг сайта при появлении полосы прокрутки?

Question

[Анатолий Кулишов]

При появлении полосы сайт сдвигается влево на несколько пикселей. Как убрать этот эффект? Чтобы вне зависимости от наличия/отсутствия полосы сайт был всегда на 1 месте.
Нашел много статей, но все они довольно давнейший, мб уже есть способ уже по элегантней?
Без JS желательно)

Comments

[Анатолий Кулишов]

К примеру, самый распространённый и самый в лоб вариант, это вот этот

body {
 overflow-y: scroll;
}

[Ankhena]

В какой момент появляется полоса прокрутки?
Если просто на одних страницах она есть, а на других нет, то это абсолютно нормально.

[Анатолий Кулишов]

Ankhena, В моменте когда нажимаем на один из пунктов аккордеона, высота резко переходит за 100vh, из-за чего появляется прокрутка, следовательно, из-за этого контент немного дергается влево, в том же хедере, довольно заметно.

[Ankhena]

Анатолий Кулишов, Можно сделать так, чтобы полоса прокрутки была всегда. Либо за счет overflow либо за счет высоты.
Можно сделать так, чтобы сайт сразу был не по центру, а со сдвигом на размер полосы (сомнительная идея).
Можно открывать аккордеон не в потоке а абсолютом.
Можно вообще пересмотреть UI.
Можно забить.

Answer 1

[lossyy]

Верстка должна быть корректной, адаптивной и изначально не под 1920 пикселей, а под 1900 с учетом что полоса прокрутки занимает 20 пикс.

Comments

[Анатолий Кулишов]

Звучит логично, надо будет обязательно сказать это дизайнеру в следующий раз)

[Анатолий Кулишов]

В Сафари кстати прокрутка висит вообще абсолютом

[Ankhena]

lossyy Только это ничего не изменит для текущего вопроса.

Answer 2

[MeMoJlor]

Есть разные браузеры. У всех разные полосы, широкие, узкие. Даже в том же хроме у старых есть полоса, а у новых она не занимает ни одного пикселя. Чтобы решить проблему, сайт должен быть резиновым.

Comments

[Анатолий Кулишов]

Хм, не совсем понял чем это поможет, даже если он резиновый на изменения размера окна с одной стороны, он так же чутка будет двигать контент в противоположную сторону

[MeMoJlor]

Анатолий Кулишов, Контент тоже придется делать адаптивным