Многие, в том числе и я, долго не мог понять почему сверстанный макет и макет, адаптированный под движек с данными выглядит абсолютно по-разному, а при переключении между вкладками одной и той же страницы наблюдается "дергание" дизайна. Такое происходит из появления вертикального скролла, когда количество информации переваливает за границы экрана. Скролл забирает место у разметки страницы и страница выглядит уже по-другому. Что сделать, чтобы такого не происходило?
Все просто - необходимо заранее предусмотреть место под скролл, т.е. включить скролл заранее независимо от количества информации на сайте. Делается это легко при помощи свойств body и html в css:
html {
height: 100%;
overflow-y: scroll;
}
body {
height: 100%;
}
После добавления этих свойств место под полосу прокрутки будет зарезервировано заранее и скачков не будет.