CSSMathValue
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Want more browser support for this feature? Tell us why.
Note: This feature is available in Web Workers.
The CSSMathValue interface of the CSS Typed Object Model API a base class for classes representing complex numeric values.
Instance properties
CSSMathValue.operator-
Indicates the operator that the current subtype represents.
Static methods
Also inherits methods from its parent interface, CSSNumericValue.
Instance methods
Also inherits methods from its parent interface, CSSNumericValue.
Interfaces based on CSSMathValue
Examples
We create an element with a width determined using a calc() function, then console.log() the operator.
<div>has width</div>
We assign a width with a calculation
div {
width: calc(30% - 20px);
}
We add the JavaScript
const styleMap = document.querySelector("div").computedStyleMap();
console.log(styleMap.get("width")); // CSSMathSum {values: CSSNumericArray, operator: "sum"}
console.log(styleMap.get("width").operator); // 'sum'
console.log(styleMap.get("width").values[1].value); // -20
The CSSMathValue.operator returns "sum" because styleMap.get("width").values[1].value ); is -20: adding a negative number.
Specifications
| Specification |
|---|
| CSS Typed OM Level 1 # complex-numeric |