- From: Šime Vidas via GitHub <sysbot+gh@w3.org>
- Date: Tue, 12 Sep 2023 06:01:00 +0000
- To: public-css-archive@w3.org
There are two separate problems: 1. How much space do scrollbars consume in the browser, generally speaking? In browsers with overlay scrollbars, that’s `0px` (because the scrollbars are overlaid). In browsers with classic scrollbars, that’s by default `15px` on macOS and `17px` on Windows. It could be more or less, depending on other factors. 2. Is a vertical classic scrollbar currently present on the web page? @Schepp’s function answers the first question. The proposed `env(scrollbar-inline-size)` variable that’s the topic of this issue would also answer this question, if I understand correctly. That’s good, but I’m also interested in the second question. Being able to answer this question in CSS would allow developers to solve the `100vw` issue. * If the scrollbar is present, then `100vw` is larger than the viewport width, so a full-width element needs to subtract the scrollbar size from its width. ```css /* classic scrollbar present */ .full-width { width: calc(100vw - env(scrollbar-inline-size)); } ``` * If the scrollbar is not present, then `100vw` is equivalent to the viewport width. ```css /* classic scrollbar not present */ .full-width { width: 100vw; } ``` As you can see, developers cannot solve the `100vw` issue with `env(scrollbar-inline-size)` alone, and without knowing the answer to the second question. It does not look like the second question will be answered in CSS anytime soon (see https://github.com/w3c/csswg-drafts/issues/6026#issuecomment-1713253071). I think the best bet to make `100vw` less of a problem in browsers with classic scrollbars is to make `100vw` smaller when `scrollbar-gutter: stable` or `overflow-y: scroll` is set on `<html>`. That proposal is discussed in https://github.com/w3c/csswg-drafts/issues/5254. -- GitHub Notification of comment by simevidas Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4691#issuecomment-1715038961 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Tuesday, 12 September 2023 06:01:03 UTC