Position-anchor funktioniert nicht, wenn der Anker position:fixed ist ⇐ CSS

[Anonymous]

Ich versuche, mithilfe der CSS-Ankerpositionierung ein an der unteren rechten Ecke eines Elements auszurichten

Code: Select all

#sidebar {
anchor-name: --sidebar;
height: 100vh;
width: max-content;
position: fixed;
/* Sidebar is fixed to the viewport */
}

button.sidebar-toggle-button {
position: absolute;
position-anchor: --sidebar;
left: anchor(right);
bottom: anchor(bottom);
z-index: 1;
}

Code: Select all

... content ...

• Wenn die Position von #sidebar auf „relativ“ oder „statisch“ eingestellt ist, funktioniert „position-anchor: --sidebar“ wie erwartet.
• Wenn ich jedoch „position: Fixed“ oder „absolute“ für „#sidebar“ einstelle, melden die DevTools von Chrome „--sidebar ist nicht definiert“ und der Positionsanchor stoppt funktioniert.

Warum schlägt es fehl? Mir fehlt etwas?

Gibt es eine Möglichkeit, es zum Laufen zu bringen?