css: Add scrollbar-gutter property to prevent shifted content

Some pages require a scroll bar, some do not. If the scroll bar is
hidden on a page that do not require it (default behavior of most
browsers), centered content is shifted to the right slightly.

Fix this behavior by using the scrollbar-gutter property, so the
renderer automatically reserves space for the scrollbar.
This commit is contained in:
Fabian Bläse 2023-02-21 00:03:39 +01:00
parent f99fe536b5
commit 7873366ba6
1 changed files with 4 additions and 0 deletions

View File

@ -1,3 +1,7 @@
html {
scrollbar-gutter: stable;
}
.book-page {
box-shadow: 0px -1.5rem 1.5rem rgba(0, 0, 0, 0.15);
padding-left: 2rem;