CSS Anchor Positioning Polyfill не обрабатывает резервные позиции ⇐ Html

[Anonymous]

Я добавил полифил Oddbird Css Anchor Positioning Polyfill Oddbird Css Anchor Positioning Polyfill для использования в Firefox, и он, кажется, работает хорошо.

Код: Выделить всё

//index.js
import polyfill from "@oddbird/css-anchor-positioning/fn";

window.addEventListener("DOMContentLoaded", () => {
if (!("anchorName" in document.documentElement.style)) {
polyfill({
elements: [
document.getElementById("exampleA"),
document.getElementById("exampleAChild"),
document.getElementById("exampleB"),
document.getElementById("exampleBChild")
]
});
}
});

Код: Выделить всё

None




* {
margin: 0;
padding: 0;
}

.anchor {
padding: 25px 100px;
}

.anchorChild {
width: 400px;
padding: 25px 0;
border: solid 1px black;
background-color: grey;
}

@position-try --anchor-fallback {
top: anchor(bottom);
right: anchor(right);
left: revert;
}




Example A



Example B



Example A Child

Example B Child

За исключением позиции-try: --anchor-fallback;, похоже, не работает, и я не смог понять, почему. Интересно, есть ли дополнительный шаг для отступлений, который мне не хватает

Подробнее здесь: https://stackoverflow.com/questions/793 ... -fallbacks