Getting Started with CSS Anchor Positioning

CSS Anchor Positioning lets you tie the position of one element to another — tooltips, popovers, and dropdowns — without JavaScript positioning libraries.

Why it matters

Before this API, positioning a tooltip relative to its trigger button meant reaching for a JS library (Popper.js, Floating UI) just to read getBoundingClientRect() on scroll and resize. Anchor Positioning moves that responsibility to the browser's layout engine, so it stays correct across scroll, resize, and zoom for free.

Try it live

Use the Anchor Positioning Studio to generate the exact anchor-name, position-anchor, and position-area values for your case, then copy the generated CSS straight into your project.