CSS scroll anchoring

The CSS scroll anchoring module defines a mechanism to prevent page movement due to DOM changes above the visible region of a scrolling box while the user is consuming the visible content.

Scroll anchoring attempts to keep the user's view of the document stable across layout changes. It works by selecting a DOM node (the anchor node) whose movement is used to determine adjustments to the scroll position. The anchor node is always a descendant of the scrolling box.

For scroll containers that are snapped to an element, scroll anchoring is limited to adjustments that would be allowed by re-snapping.

Reference

Properties

Glossary and definitions

Guides

Guide to scroll anchoring

How to enable and disable scroll anchoring and suppression triggers, and when and why you should use them.

Specifications

Specification
CSS Scroll Anchoring Module Level 1

See also