Anchor positioning = CSS that pins one element to the edges of another, with no JavaScript doing the maths.
The problem: back in January the internet decided this was finished and told everyone to delete their tooltip library. Half of that advice was right.
Here is the honest split. The placing is done. The hovering is not.
You can drop the library that puts the box in the right place. You cannot yet drop the code that decides when the box shows up.
1. The popover half has been safe for nearly two years
What it does: the popover attribute plus a popovertarget button opens a box in the top layer. Escape closes it. A click outside closes it. :popover-open styles it while it is open.
Why it matters: not bundle size. Focus and dismissal. Your library faked a stacking context and guessed at a z-index. It could never actually be the top layer, because that is not a thing scripts can join.
Status: Baseline since January 2025. Chrome 114, Firefox 125, Safari 17.
2. The positioning half only landed in September
What it does: anchor-name on the trigger, position-anchor on the box, position-area to say which side it sits on. That is the whole setup.
The date people get wrong: MDN dates position-anchor to September 2026, not January. Chrome and Safari had most of the pieces long before that. The last corners were only filled in this autumn.
Why the wait: the Baseline call was argued over in the open for ten months. The objection was that this is dozens of separate properties wearing one name, and some of them were still broken.
3. Flip to fit is a CSS rule now, not a scroll listener
Write a @position-try block, name it in position-try-fallbacks, and the browser moves the box when it would fall off the screen. position-visibility hides it once the thing it points at has scrolled away. That is the part of the library most teams never got working properly anyway.
4. The hover tooltip is still Chrome only
A tooltip appears on hover, not on click. The native answer is the interestfor attribute, which also handles keyboard and long press. Chrome shipped it in version 142. Firefox and Safari have not shipped it at all.
The hint popover state is the same story. That is the one tooltips want, so a tooltip does not slam your open menu shut. Chrome and Firefox have it. Safari has it in preview only, and Safari on iOS does not have it.
5. One rename will bite you
position-area used to be called inset-area. Both names still work for now. If a tutorial uses the old one, it was written before the rename, which tells you how fresh the rest of its advice is.
Who does each job now
| The job | Who does it today |
|---|---|
| Put the box beside the trigger | CSS, every browser |
| Flip it when it hits an edge | CSS, every browser |
| Draw it above everything else | The popover top layer |
| Close on Escape or an outside click | The browser |
| Hide it when the anchor scrolls off | CSS, position-visibility |
| Show it on hover | Your code, outside Chrome |
Run this on your own code
- Open one tooltip using only the keyboard. If you cannot reach it or close it, the library was never the accessible choice.
- Count the lines of positioning maths you own. CSS does that for free now.
- Check what triggers it. Click means you can switch today. Hover means you keep a small piece of script.
- Search your styles for
inset-area. If it is there, the snippet is out of date.
The library is not the villain. It is doing a job the browser now does better, apart from one job it still does alone.
Get the PDF