Tab Atkins-Bittner
summary
New CSS feature lets absolute-positioned boxes lock to named anchors (author names must start with --) using inset-area and the anchor() function; it exposes anchor size, supports math (e.g. calc(anchor(...) ± 20px)), and has position-try options (flip, scrollable fallbacks) plus position-visibility anchors-visible. Chrome ships an early variant in Chrome 125 and demos work in Canary; compositor scrolling is supported but limited to the default anchor and ignores transforms, and the spec/impl is still changing.
AI-written summary · about
chapters (11)
- 0:00Anchor positioning intro
- 1:10What is anchor positioning
- 4:00How CSS positioning works
- 16:32Basic usage
- 19:41Inset area property
- 26:26Advanced anchor function
- 31:29Anchor with scrolling
- 37:31Overflow handling
- 45:38Mobile visibility
- 47:24Real-world uses
- 48:10Q&A
