On Monday, June 16, 2025 at 1:14:29 PM UTC+2 Daniil Sakhapov wrote:

Contact emailssakha...@chromium.org

ExplainerCurrently 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 identifiers 
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, the browser runs an algorithm to 
determine the 'current scroll marker' and authors can style such anchor 
elements with :target-current pseudo class.


Apologies, but can you expand a bit on the explainer and outline how you 
would expect web developers to use this and what experiences that would 
create?
Also, a code example would be very useful. 



Specificationhttps://drafts.csswg.org/css-overflow-5/#scroll-target-group

Summary

The scroll-target-group property specifies whether the element is a scroll 
marker group container. 'none': The element does not establish a scroll 
marker group container. 'auto': The element establishes a scroll marker 
group container forming a scroll marker group containing all of the scroll 
marker elements for which this is the nearest ancestor scroll marker group 
container. Establishing a scroll marker group container allows for anchor 
HTML elements with fragment identifiers that are inside such a container to 
be HTML equivalent of ::scroll-marker pseudo elements. The anchor element 
whose scroll target (the element its fragment identifier is pointing to) is 
currently in view to be styled via :target-current pseudo class. 

Blink componentBlink>CSS 
<https://issues.chromium.org/issues?q=customfield1222907:%22Blink%3ECSS%22>

TAG review
General TAG review for scroll navigation control primitives
https://github.com/w3ctag/design-reviews/issues/1037

TAG review statusNot applicable

Risks

Interoperability and Compatibility

None

*Gecko*: No signal (https://github.com/mozilla/standards-positions/issues/
1251) 
Related issue https://github.com/mozilla/standards-positions/issues/1161

*WebKit*: No signal (https://github.com/WebKit/
standards-positions/issues/514) 
Related issue https://github.com/WebKit/standards-positions/issues/447

*Web developers*: Multiple verbal approvals at CSS Day 2025.

*Other signals*:

WebView application risks

Does this intent deprecate or change behavior of existing APIs, such that 
it has potentially high risk for Android WebView-based applications?

None


Debuggability

Covered by DevTools

Will this feature be supported on all six Blink platforms (Windows, Mac, 
Linux, ChromeOS, Android, and Android WebView)?Yes

Is this feature fully tested by web-platform-tests 
<https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md>
?Yes

https://wpt.fyi/css/css-overflow/scroll-target-group-001.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-002.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-003.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-004.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-005.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-006.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-007.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-008.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-009.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-010.html 
https://wpt.fyi/css/css-overflow/scroll-target-group-011.html


Flag name on about://flagsCSSScrollTargetGroup

Rollout planWill ship enabled for all users

Requires code in //chrome?False

Tracking bughttps://chromium-review.googlesource.com/c/chromium/
src/+/6607668

Estimated milestonesDevTrial on desktop138DevTrial on Android138
Anticipated spec changes

Open questions about a feature may be a source of future web compat or 
interop issues. Please list open issues (e.g. links to known github issues 
in the project for the feature specification) whose resolution may 
introduce web compat/interop risk (e.g., changing to naming or structure of 
the API in a non-backward-compatible way).
None

Link to entry on the Chrome Platform Statushttps://chromestatus.com/
feature/5189126177161216?gate=5135644355198976

This intent message was generated by Chrome Platform Status 
<https://chromestatus.com/>.

-- 
You received this message because you are subscribed to the Google Groups 
"blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to blink-dev+unsubscr...@chromium.org.
To view this discussion visit 
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/4aa5be46-5a40-43c7-bd79-8913651a491dn%40chromium.org.

Reply via email to