Intent to Prototype: CSS sticky positioning in single-axis scroll containers
148 views
Skip to first unread message
Chromestatus
Mar 16, 2026, 10:36:20 AM (2 days ago)
Mar 16
to blin...@chromium.org, freede...@google.com
Contact emails
freede...@google.com
Explainer
No information provided
Specification
No information provided
Summary
Keeps CSS sticky positioning working when horizontal and vertical scrolling come from different containers. This helps developers build wide tables and data grids with horizontally scrollable content and vertically sticky headers, without duplicating headers or synchronizing scroll in JavaScript. Blink component
Blink>Layout
Web Feature ID
sticky-positioning
Motivation
CSS sticky positioning currently resolves against a single nearest scroll container, which breaks common layouts where horizontal and vertical scrolling come from different ancestors. A common case is a wide table or data grid that scrolls horizontally inside a vertically scrolling page: the header should remain visible as the page scrolls, while horizontally sticky content should stay attached to the inner scroller. Today the inner horizontal scroller becomes the sticky reference for both axes, so vertical sticking becomes ineffective.
Allowing sticky constraints to resolve per axis makes these split-axis layouts work with normal CSS. Without this, authors resort to duplicated headers, DOM restructuring, or JavaScript scroll synchronization. Initial public proposal
https://github.com/w3c/csswg-drafts/issues/865
Goals for experimentation
None Requires code in //chrome?
False Tracking bug
https://issues.chromium.org/481019005
Estimated milestones
No milestones specified
Link to entry on the Chrome Platform Status
https://chromestatus.com/feature/5067363861004288?gate=5107178476273664
Reply all
Reply to author
Forward
Search
Clear search
Close search
Google apps
Main menu
