This feature is not Baseline because it does not work in some of the most widely-used browsers.
The name read-only property of the CSSPositionTryRule interface represents the name of the position try fallback option specified by the @position-try at-rule's <dashed-ident>.
A string.
The CSS includes a @position-try at-rule with a name of --custom-bottom and three descriptors.
@position-try --custom-bottom {
top: anchor(bottom);
min-width: 100px;
margin-top: 10px;
}
const myRules = document.styleSheets[0].cssRules; const tryOption = myRules[0]; // a CSSPositionTryRule console.log(tryOption.name); // "--custom-bottom"
| Specification |
|---|
| CSS Anchor Positioning> # dom-csspositiontryrule-name> |
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | |
name |
125 | 125 | 131 | 111 | 26 | 125 | No | 83 | 26 | 27.0 | 125 | 26 |
CSSPositionTryDescriptors@position-tryposition-try-fallbacks
© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/CSSPositionTryRule/name