← Back to release summary

CSS Anchor Positioning: anchor-scope

Category

CSS

Type

Chromium catches up

Status

Enabled by default (Chrome 131)

Intent stage

None

• Breaking change: No
• Enterprise impact: None
• Spec maturity: Working draft
• Web Platform Tests: Yes

WPT details: https://wpt.fyi/results/css/css-anchor-position?label=master&label=experimental&aligned&q=anchor-scope

Summary

The anchor-scope property allows limiting the visibility of anchor names to a given subtree.

Standards & signals

• Specification: https://drafts.csswg.org/css-anchor-position-1/#anchor-scope
• Firefox: Positive — (Applies to CSS Anchor Positioning as a whole).
• Safari: Support — (Applies to CSS Anchor Positioning as a whole).
• Web developers: Strongly positive — (Copied from the main CSS Anchor Positioning intent). Strongly positive (https://crbug.com/40059176 has 37 stars) Lots of excited developer blog posts: https://kizu.dev/anchor-positioning-experiments/ https://12daysofweb.dev/2023/anchor-positioning/ https://blog.logrocket.com/use-css-anchor-positioning/ https://frontendmasters.com/blog/drawing-a-line-to-connect-elements-with-css-anchor-positioning/ https://medium.com/@shriyanspranaybuisness/css-anchor-positioning-ec9f861f4498
• Tracking bug: https://issues.chromium.org/issues/40281992

Ecosystem

• Web Platform Tests: https://wpt.fyi/results/?q=anchor-scope
• Chrome Platform Showcase: https://chrome-platform-showcase.paulkinlan-ea.deno.net/features
• GenDN reference: https://gendn.paulkinlan-ea.deno.net/features
• chrome.dev demos search: https://www.google.com/search?q=site%3Achrome.dev+CSS%20Anchor%20Positioning%3A%20anchor-scope
• MDN Web Docs: https://developer.mozilla.org/en-US/search?q=CSS%20Anchor%20Positioning%3A%20anchor-scope
• Baseline status: https://webstatus.dev/?q=CSS%20Anchor%20Positioning%3A%20anchor-scope

View on chromestatus.com