Update reset and position-anchor:auto information relating to implicit anchor association

[chrisdavidmills]

Description

In our docs, we've included information about having to reset the default values set on popover elements, such as inset and margin property values, so that they don't break attempts to position popovers using anchor()/position-area/anchor-center.

However, as per #45515, the default behavior has been updated so that the need for these resets is avoided, except for the anchor() cases. In addition, #45514 points out that position-anchor: auto is needed to opt-in to the association, in the anchor() cases.

This PR attempts to update our information so that it is no longer out of date.

I wrote some quick demos to test the updated behavior:

• anchor(): https://codepen.io/editor/Chris-Mills/pen/01a07b77-d3a7-7f58-b78a-3265437f0047
• position-area: https://codepen.io/editor/Chris-Mills/pen/01a07b9e-73d6-75a9-a056-c5b91edadcb4
• anchor-center: https://codepen.io/editor/Chris-Mills/pen/01a07b83-0beb-74da-b0c1-cf4f5f566331

Note: Another thing I noticed — even though popovers and their control buttons are meant to have implicit association, meaning that you shouldn't need to associate them with anchor-name/position-anchor, it seems like I needed to set position-anchor: auto in cases where I was doing resets to make the anchor positioning work. I was surprised by this, and I'm not 100% sure what I should say about it in the docs. This is maybe something @mfreed7 could advise me on. -- Update: I've now read the other issue and am now clear on what is going on here. I will fix both in this PR ;-)

See also mdn/dom-examples#396 for a related demo fix.

Motivation

Additional details

Related issues and pull requests

Fixes #45515
Fixes #45514

[github-actions]

Preview URLs (5 pages)

• /en-US/docs/Web/API/Popover_API/Using
• /en-US/docs/Web/CSS/Guides/Anchor_positioning/Using
• /en-US/docs/Web/CSS/Reference/Properties/position-anchor
• /en-US/docs/Web/CSS/Reference/Properties/position-area
• /en-US/docs/Web/CSS/Reference/Values/anchor

External URLs (7)

URL: /en-US/docs/Web/API/Popover_API/Using
Title: Using the Popover API

• https://html.spec.whatwg.org/multipage/rendering.html (1 time) (Note! This may be a new URL 👀)
• https://mdn.github.io/dom-examples/popover-api/ (1 time) (Note! This may be a new URL 👀)
• https://mdn.github.io/dom-examples/popover-api/popover-hint/ (2 times) (Note! This may be a new URL 👀)

---

URL: /en-US/docs/Web/CSS/Reference/Properties/position-area
Title: position-area CSS property

• https://html.spec.whatwg.org/multipage/rendering.html (1 time) (Note! This may be a new URL 👀)

---

URL: /en-US/docs/Web/CSS/Reference/Values/anchor
Title: anchor() CSS function

• https://drafts.csswg.org/css-anchor-position-1/ (1 time)
• https://drafts.csswg.org/css-values-4/ (1 time)
• https://html.spec.whatwg.org/multipage/rendering.html (1 time)

(comment last updated: 2026-09-08 08:41:09)

[arpit-agr]

Hi @chrisdavidmills,

On your note about needing position-anchor: auto when doing resets, I think there are two separate spec changes here and both check if position-area is none. That's what makes them look like one thing.

1. As per §3.1, "the used value of any auto inset properties and auto margin properties resolves to 0". That's the one this PR documents.
2. As per §2.4, the initial value of position-anchor is normal and normal behaves as none while position-area is none.

position-area	Insets and margin	position-anchor: normal
set (not none)	auto values resolve to 0, so no resets needed	behaves as auto, so implicit anchor is adopted
none	popover defaults conflict, so resets are needed	behaves as none, so no default anchor box

So I don't think the resets are what breaks it. With anchor() and no position-area, position-anchor behaves as none, there's no default anchor box, and anchor(top) makes the declaration invalid at computed-value time. position-anchor: auto opts it back in.

I wrote about this with the spec quotes and some suggested prose in #45514 . Happy for it to be folded in here or handled separately.

[arpit-agr]

Sorry, I missed your update before posting. Glad it's clear now.

[chrisdavidmills]

Sorry, I missed your update before posting. Glad it's clear now.

@arpit-agr no worries at all — thanks for the detailed info; it saved me a lot of time.

This PR is now ready for review, and should fix both issues.