css: static font-size, less side margins Because `max-width` is set in pixels, and `font-size` is relative to the display width, as the screen gets wider, the *less* characters fit on a line. This gets especially absurd on ultrawide displays. AFAIK the default font size should always be readable, so I just removed the explicit `font-size` completely, which fixes the issue. `max-width` could also be changed to be measured in `ch`, to make the characters/line consistent across fonts, but I wanted to change as little as possible. I also removed the `ul` padding. It doesn't really do anything on large screens, and I think the additional space on narrow screens is worth it.
dzwdz 21179077+dzwdz@users.noreply.github.com
Sat, 05 Aug 2023 20:12:12 +0200
1 files changed,
2 insertions(+),
3 deletions(-)
jump to
M
files/static/style.css
→
files/static/style.css
@@ -4,7 +4,6 @@ max-width: 600px;
margin: 20px auto; /* make sure the scrollbar is always shown so the width doesnt change between pages */ - font-size: calc(12px + 0.5vw); overflow-y: scroll; }@@ -31,8 +30,8 @@ }
ul { list-style-type: none; - padding-left: 30px; - padding-right: 30px; + padding-left: 0; + padding-right: 0; } ul li {