permanent scrollbar

Posted: October 25th, 2019

The global stylesheet for this website contains this line:

html {
    overflow-y: scroll;
}

This line permanently displays the vertical scrollbar.

Why? To save face, it's a silent rebellion against the scrollbar being killed in the name of design aesthetic. In truth, it's because the scrollbar actually changes the width of the page when visible. If the entire page can be viewed on one screen, the scrollbar is not displayed (in Chromium and Firefox, as of me writing this). If the content overflows, the scrollbar appears. In order to center the contents of the page, I used margin: auto; to center contents. The scrollbar appears, the page gets thinner, and the center line shifts to the left by half of the width of a scrollbar. It's particularly annoying when changing tabs or when pages load quickly enough to see the content jumping left and right. Solution? Always display the scrollbar, even when there's no overflow.