demo · v133

position-area grid

Nine buttons, nine popovers, each labelled with the position-area keyword that places it. No anchor-name, no position-anchor — the invoker is the implicit anchor. Click each button to see the popover snap to its slot.

block-start
top right
inline-end
bottom right
block-end
bottom left
inline-start
top left
center

Each popover targets a region of the 3×3 invoker grid via position-area. Pre-133 you needed position-anchor: --foo; plus matching anchor-name: --foo on the invoker. Now popovertarget sets up the anchor relationship implicitly.

see also