Bug 304551 – CSS anchor positioning with a fixed-positioned anchored element works incorrectly in the top layer

• Status: RESOLVED
• Resolution: DUPLICATE
• Component: Layout and Rendering

[Pavel Pomerantsev]

Created attachment 477806 [details]
Chrome (correct) and Safari (incorrect) layouts side by side

An element is positioned incorrectly if all of the following are true:
* It's anchor-positioned (has a `position-anchor` set to an existing element).
* It has `position: fixed`.
* Both the element and its anchor are in the top layer.

See example with a modal dialog and a fullscreen element (both examples of top layer usage): https://codepen.io/pavelp/pen/ByzBKrE

Compare layout in latest Chrome (appears to be correct) vs latest Safari TP (appears incorrect).

Note: this may or may not be a duplicate of https://bugs.webkit.org/show_bug.cgi?id=289743. Top layer is mentioned there, but it looks like currently all the top-layer tests in https://wpt.fyi/results/css/css-anchor-position?label=experimental&label=master&aligned are passing in Safari TP, so this might be a case for which a web platform test doesn't exist yet.

[Radar WebKit Bug Importer]

<rdar://problem/167239379>

[Kiet Ho]

Hello, thank you for the bug report including the repro. I'm currently looking at this issue, and it seems to be the same as bug 301023.

[Kiet Ho]

I can confirm that this will be fixed by bug 301023.

*** This bug has been marked as a duplicate of bug 301023 ***

[Pavel Pomerantsev]

That’s great, thanks so much for fixing!