-
Notifications
You must be signed in to change notification settings - Fork 756
Description
Moved from https://crbug.com/580570 (2016):
The CSS spec says that "html { overflow: scroll; }" and "body { overflow: scroll; }" are equivalent - in both cases you're just setting the scrolling mode of the viewport. But "html, body { overflow: scroll; }" is special - in that case body actually get's its own scrolling box independent from the viewport.
This is widely supported, but can be a little confusing. Let's explore whether this behavior is really necessary for web compatibility. We could potentially simplify things by saying that overflow applied to body ALWAYS applies to the viewport.
This is currently the case in css-overflow-3 which says that
UAs must apply the overflow-* values set on the root element to the viewport. However, when the root element is an [HTML] html element (including XML syntax for HTML) whose overflow value is visible (in both axes), and that element has a body element as a child, user agents must instead apply the overflow-* values of the first such child element to the viewport. The element from which the value is propagated must then have a used overflow value of visible.
This further clarified in cssom-view and is the current behavior in both chrome and firefox as confirmed by https://codepen.io/george-steel/pen/mdPdQgw, which produces two sets of scrollbars.
Is there any use for this behavior, or should be simplified?