Scroll container

A scroll container is an element box whose content can be scrolled, whether or not scroll bars are present. An element box becomes a scroll container when its overflow property (or overflow-x or overflow-y) is set to scroll, auto, or hidden.

Each scroll container overflow value controls when scroll bars are shown:

• scroll: Scroll bars are always shown, if the platform displays them.
• auto: Scroll bars are shown only when the content overflows the box.
• hidden: No scroll bars are shown, and the user can't scroll the content directly, but it can still be scrolled programmatically, for example with Element.scrollTo() or by focusing an element inside it.

A scroll container always:

• Establishes a new block formatting context, so it contains floats and its margins don't collapse with its children's margins.
• Scts as the reference box for descendants with position set to sticky.
• Has an automatic minimum size of 0 when it is a flex or grid item, so it can shrink smaller than its content.