diff --git a/css-typed-om/Overview.bs b/css-typed-om/Overview.bs index 8528aa2d..8e0efc7c 100644 --- a/css-typed-om/Overview.bs +++ b/css-typed-om/Overview.bs @@ -1416,28 +1416,40 @@ appear as computed values (i.e. as a value stored on computed Computed {{CSSUnparsedValue}} objects {#computed-unparsedvalue-objects} ----------------------------------------------------------------------------- -Custom property references are resolved as part of style computation. Accordingly, -computed {{CSSUnparsedValue}} objects will not contain {{CSSVariableReferenceValue}} objects. -As a result, only a single {{DOMString}} will appear in the sequence contained by -computed {{CSSUnparsedValue}} objects. - -Furthermore, values that at specified value time contained custom property references -are renormalized after computation. +A property with a specified {{CSSUnparsedValue}} value will not +compute to a {{CSSUnparsedValue}}. Instead, after custom property references +are resolved, the {{CSSStyleValue}} subclass appropriate to the property will be +used.
+For example, a style rule containing: -Consider an element "e" with an inline style that specifies a width of var(--baz). +
+width: calc(var(--foo) + 10%);
+
-Assuming that the custom property --baz contains the value "42px", running the following code: +Will represent a specified width as an {{CSSUnparsedValue}}, but if this value +is the winning value during computation for a given element then that element's +computed width will be represented by a {{CSSLengthValue}} object (assuming +that --foo resolves to a valid substitution). +
-
-var a = e.styleMap.get('width');
-var b = getComputedStyleMap(e).get('width');
-
+Often there will be no {{CSSStyleValue}} subclass appropriate - for example when a custom property +contains a reference to another custom property. In these cases, a {{CSSStyleValue}} +is used directly to represent a valud of unknown type. -Will result in "a" containing a {{CSSUnparsedValue}} with a single {{CSSVariableReferenceValue}} -in its sequence, and "b" containing a {{CSSSimpleLength}} representing 42px. +
+ +For example, a style rule containing: + +
+--foo: var(--bar) black;
+
+Will represent a specified value for --foo as a {{CSSUnparsedValue}}, and if +this value is the winning declaration for --foo during computation for a given +element, then that element's will have a computed value for --foo that is +represented by a {{CSSStyleValue}}.
Computed {{CSSKeywordValue}} objects {#computed-keywordvalue-objects}