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

Has anyone ever suggested a dynamic environment variable that would return the *current* viewport size reduction caused by a classic scrollbar on the page? Would that be possible? Would that make sense?

```css
.full-width {
  width: calc(100vw - env(viewport-reduction-inline));
}
```

So if the page does not have a vertical classic scrollbar, `env(viewport-reduction-inline)` returns `0px`, and the element is `100vw` wide, but if the page does have such a scrollbar, the environment variable returns how much inline space this scrollbar takes (usually 15 to 17 pixels), and the page can subtract that from `100vw` to get the actual viewport width and then set the element to that width.

This does not seem like a good solution to me, but I wanted to put it out there, since I haven’t seen this suggested yet.

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


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

Received on Monday, 11 September 2023 06:14:04 UTC