[csswg-drafts] [css-overflow] Viewport's overflow is not defined when the root has `display: none` (#12649)

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

== [css-overflow] Viewport's overflow is not defined when the root has `display: none` ==
https://drafts.csswg.org/css-overflow-3/#overflow-propagation

> UAs must apply the `overflow-*` values set on the root element to the [viewport](https://w3c.github.io/epub-specs/epub33/core/#dfn-viewport) when the root element’s [`display`](https://drafts.csswg.org/css-display-3/#propdef-display) value is not [`none`](https://drafts.csswg.org/css-display-4/#valdef-display-none). However, when the root element is an [[HTML]](https://drafts.csswg.org/css-overflow-3/#biblio-html) [`<html>`](https://html.spec.whatwg.org/multipage/semantics.html#the-html-element) element (including [XML syntax for HTML](https://html.spec.whatwg.org/multipage/introduction.html#html-vs-xhtml)) whose [`overflow`](https://drafts.csswg.org/css-overflow-3/#propdef-overflow) value is [`visible`](https://drafts.csswg.org/css-overflow-3/#valdef-overflow-visible) (in both axes), and that element has as a child a [`<body>`](https://html.spec.whatwg.org/multipage/sections.html#the-body-element) element whose `display` value is also not `none`, user agents must instead apply the `overflow-*` values of the first such child element to the viewport.

The spec is clear that we don't propagate from the root element in that case.

The spec could be interpreted as still allowing to propagate from the `<body>` (being in a `display: none` subtree doesn't mean that it has `display: none` itself), but no browser does that, as seen here:

```html
<!DOCTYPE html>
<html style="display: none">
<style>
::-webkit-scrollbar { background-color: #eff0f1; width: 12px; height: 12px; }
::-webkit-scrollbar-thumb { background: #898c8d }
</style>
<body style="overflow: scroll">
```

Regardless, if both the root and the body have `display: none`, the spec is clear that we don't propagate from either of them.
So what `overflow` does the viewport use?

The obvious choice is the initial `overflow: visible`, which will behave as `auto`:

> If [visible](https://drafts.csswg.org/css-overflow-3/#valdef-overflow-visible) is applied to the viewport, it must be interpreted as [auto](https://drafts.csswg.org/css-overflow-3/#valdef-overflow-auto).

Since there is no box, it's hard to tell if browsers are using `visible`/`auto` or `clip`/`hidden`. Nobody uses `scroll`, though.


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


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

Received on Sunday, 24 August 2025 21:51:31 UTC