1 year ago

#387025

test-img

Ilya Loskutov

What is the initial scroll container?

For a sticky positioned box properties like top, right define offsets from respective edges of the nearest scrollport. And this entity is described by the spec as follows:

These properties [overflow-*] specify whether a box’s content (including any ink overflow) is clipped to its padding edge, and if so, whether it is a scroll container that allows the user to scroll clipped parts of its scrollable overflow area into view. The visual viewport of the scroll container (through which the scrollable overflow area can be viewed) coincides with its padding box, and is called the scrollport.

Having such a plain DOM hierarchy as html > body > div when the div is sticky positioned, what would be its nearest scroll container? To put it another way, what's the box which gets those fancy scrolling arrows from the UA as long as the div's content starts to exceed 100vh?

The overflow-* properties of both html and body are computed to visible (tested in Chrome), so their boxes are not scroll containers. So am I getting it right that the concerned box is initial containing block? But I can't find proof.

css

scroll

0 Answers

Your Answer

Accepted video resources