[jcutrell]

How is anchor different from relative?

[staminade]

The article I linked goes into the details, but basically a relative approach constrains your markup: The positioned thing must be a child of the relatively positioned anchor or a wrapper element, and you often cannot sensibly position it without using JS to check the location of the anchor. E.g. a popover menu for a button must check if the button is close to an edge of the viewport and position the menu element appropriately. Anchor positioning will do this automatically.

Also, if support for multiple anchors is included, then it opens up some very interesting capabilities to do things like draw arbitrary diagram connectors between elements: https://kizu.dev/anchor-positioning-experiments/

[karaterobot]

I've been eagerly awaiting anchor positioning, but using it for diagram connectors had not occurred to me yet! That would solve so many problems that I currently have (or plan) to use D3 for.

[CuriouslyC]

They explain in the first couple paragraphs of the first link provided.

[paavohtl]

position: relative adds a fixed offset to the position the element would have been placed in normally, but position: anchor can be used to place an element near any arbitrary element, regardless of its place in the DOM hierarchy.