CSSPositionTryRule: style property

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

The read-onlystyle property of theCSSPositionTryRule interface contains aCSSPositionTryDescriptors object representing the descriptors available in the@position-try rule's body.

Value

ACSSPositionTryDescriptors object.

Although thestyle property itself is read-only in the sense that you can't replace theCSSPositionTryDescriptors object, you can still assign to thestyle property directly, which is equivalent to assigning to itscssText property. You can also modify theCSSPositionTryDescriptors object using thesetProperty() andremoveProperty() methods.

Examples

The CSS includes a@position-try at-rule with a name of--custom-right and three descriptors.

css

@position-try --custom-bottom {  top: anchor(bottom);  min-width: 100px;  margin-top: 10px;}

const myRules = document.styleSheets[0].cssRules;const tryOption = myRules[0]; // a CSSPositionTryRuleconsole.log(tryOption.style.top); // "anchor(bottom)"console.log(tryOption.style["min-width"]); // "100px"console.log(tryOption.style.positionArea); // ""; no position-area specified