[csswg-drafts] [css-values-4] Clarify viewport sizes with overflow: scroll on the root element (#12518)

gitspeaks has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-values-4] Clarify viewport sizes with overflow: scroll on the root element ==
Section [6.1.2.1. The Large, Small, and Dynamic Viewport Sizes](https://drafts.csswg.org/css-values-4/#viewport-variants) states:

> In all cases, **if the value of overflow or scrollbar-gutter on the root element in either axis would cause scrollbars to appear (or space to be reserved for them) unconditionally (for example, overflow: scroll, but not overflow: auto), the computed values of the viewport-percentage lengths in that axis are reduced in accordance with the initial containing block.** Otherwise, and always in the case of media queries, the viewport-percentage lengths are sized assuming that scrollbars do not exist (even if this diverges from the initial containing block).

My understanding is that the initial containing block (ICB) has the same dimensions as the  viewport, and the viewport dimensions exclude classic scrollbars (non-floating) but include floating ones.

However, in the following example:

```html
<!DOCTYPE html>
<html style="overflow: scroll; width: 100vw; height: 100vh; background-color: red; margin: 0; padding: 0;"></html>
```

In Desktop Chrome, the `<html>` element visibly overlaps the scrollbars. See DevTools screenshot:

<img width="487" height="222" alt="Image" src="https://github.com/user-attachments/assets/192898be-760a-40f8-9549-42d9d6d2ea60" />


Is this a bug in Chrome, or am I misunderstanding the spec's intent regarding how `100vw`/`100vh` interact with unconditionally present scrollbars on the root element?

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/12518 using your GitHub account


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

Received on Wednesday, 23 July 2025 18:24:01 UTC