Re: [csswg-drafts] [css-values] Use of 100vw is causing pointless horizontal scrollbars on some websites (#6026)

> Winging back to @bfgeek’s [concern](https://github.com/w3c/csswg-drafts/issues/6026#issuecomment-1832490269): I’ve asked some colleagues to query the HTTP archive to see:
> 
> 1. How often the `width: calc(100vw - var(--scrollbar-width))` pattern is used.
> 2. How often `overflow: scroll` or `scrollbar-gutter: stable` on the `:root` is used.
> 3. How often both are used together
> 
> I’m still waiting on the results of these queries.

I ran some tests and here are the results: In total 12,089,606 root pages found in the HTTP Archive November 2023 Dataset were scanned. Out of those 12 million scanned pages:

- 324,866 use the `calc(100vw - <length>)` pattern (2.6871512603%)
- 4,112 have `overflow: scroll` _declared_ on the root element (0.03401268825%)
- 72 pages use both (0.0005955529072%)

Of those 72 pages, only 38 seem to use the `calc()` expression to cater for scrollbars (0.0003143195899%). The ignored 34 pages did a calculation with a `<length>` greater than `50px` which seems like an unlikely width for a scrollbar to have.

Conclusion: If we change how `100vw` computes when `overflow: scroll` is set on root, 0.0003143195899% of the pages found in the HTTP Archive November 2023 Dataset will be affected by [the change we resolved on](https://github.com/w3c/csswg-drafts/issues/6026#issuecomment-1832443514).

-- 
GitHub Notification of comment by bramus
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6026#issuecomment-1919428550 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 31 January 2024 16:11:43 UTC