standards-positions
standards-positions copied to clipboard
WebKit
CSS scroll-target-group property
WebKittens
No response
Title of the proposal
CSS scroll-target-group property
URL to the spec
https://drafts.csswg.org/css-overflow-5/#scroll-target-group
URL to the spec's repository
No response
Issue Tracker URL
No response
Explainer URL
No response
TAG Design Review URL
No response
Mozilla standards-positions issue URL
https://github.com/mozilla/standards-positions/issues/1251
WebKit Bugzilla URL
No response
Radar URL
No response
Description
Short description: https://github.com/WebKit/standards-positions/issues/447 is about pseudo element navigation controls. This property enriches HTML anchor elements functionality to match the pseudo elements one.
Currently to create carousel or table of contents patterns authors can use ::scroll-marker pseudo elements to create navigation elements. As they are pseudo elements they have a number of limitations.
The scroll-target-group property allows to overcome such limitations by making HTML anchor elements 'scroll markers'. By specifying fragment identifier authors have 'scroll target into the view' functionality of ::scroll-markers, but don't have the 'tracking of current scroll marker' one. With scroll-target-group property, browser runs an algorithm to determine the 'current scroll marker' and authors can style such anchor element with :target-current pseudo class.
