Intent to Ship: Decouple border-width, outline-width and column-rule-width values from their corresponding style values

[Chromestatus]

Contact emails

samome...@microsoft.com, kbab...@microsoft.com

Explainer

No information provided

Specification

https://github.com/w3c/csswg-drafts/pull/11913/files

Summary

This proposal untangles ‘border-width’, ‘outline-width’, and ‘column-rule-width’ from their corresponding ‘*-style’ properties. Previously, if a ‘*-style’ property, such as ‘border-style’, was set to ‘none’ or ‘hidden’, the computed ‘*-width’, such as ‘border-width’, would resolve to ‘0px’, even if the width was explicitly set to ‘10px’. Following a resolution in the CSSWG [1], the computed values of ‘border-width’, ‘outline-width’, and ‘column-rule-width’ will now reflect their specified values, regardless of the associated style property's value. Similarly, the resolved values of ‘outline-width’, and ‘column-rule-width’ will now reflect their specified values, regardless of the associated style property's value. [1]: https://github.com/w3c/csswg-drafts/issues/11494#issuecomment-2675800489

Blink component

Blink>CSS

Web Feature ID

No information provided

Motivation

Today, CSS special-cases ‘border-*-width’, ‘outline-width’, and ‘column-rule-width’ so that their computed value becomes ‘0px’ when the corresponding ‘*-style’ is ‘none’ or ‘hidden’, even if the author specified a nonzero width. With Gap Decorations extending ‘column-rule-*’ properties to support lists/repeaters, applying that special-case becomes ambiguous and difficult to define consistently. Having ‘*-width’ values independent of ‘*-style’, provides an intuitive model for these properties and better reflects the author-specified value.

Initial public proposal

https://github.com/w3c/csswg-drafts/issues/11494

Search tags

column-rule-width, border-width, outline-width

TAG review

No information provided

TAG review status

Not applicable

Risks

Interoperability and Compatibility

The interoperability risk is low as both Gecko and Webkit have already implemented these changes. Compatibility risk is also low. The resolved value for `border-width` via `getComputedStyle()` will remain 0px when `border-style` is set to `none`/ `hidden`, maintaining backward compatibility. For `outline-width` and `column-rule-width`, both computed and resolved values will show the specified values, as these properties are rarely queried and unlikely to impact existing content. To support the claim, we collected UseCounter data measuring how often these values are queried. The computed‑value counters for these properties are extremely low (<0.0001%). The resolved‑value counters for ‘column-rule-width’ and ‘outline-width’ show ~2.37% usage, which reflects calls to ‘getComputedStyle()’ rather than observable rendering usage. Since ‘getComputedStyle()’ is frequently queried by automated tooling (e.g. scrapers and fingerprinting scripts) that do not depend on property semantics, this usage does not indicate meaningful web‑facing reliance. As a result, the compatibility risk remains low.

Gecko: Shipped/Shipping (https://bugzilla.mozilla.org/show_bug.cgi?id=1998285)

WebKit: Shipped/Shipping (https://bugs.webkit.org/show_bug.cgi?id=304940)

Web developers: No signals

Other signals:

WebView application risks

Does this intent deprecate or change behavior of existing APIs, such that it has potentially high risk for Android WebView-based applications?

No information provided

Debuggability

No extra functionality is needed in Devtools to debug this feature update.

Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, ChromeOS, Android, and Android WebView)?

Yes

Is this feature fully tested by web-platform-tests?

Yes
https://wpt.fyi/results/css/css-backgrounds/animations/border-width-interpolation.html https://wpt.fyi/results/css/CSS2/ui/outline-width-096.xht https://wpt.fyi/results/css/CSS2/borders/border-width-011.xht https://wpt.fyi/results/css/CSS2/borders/border-width-012.xht https://wpt.fyi/results/css/css-ui/parsing/outline-width-computed.html https://wpt.fyi/results/css/css-ui/outline-009.html https://wpt.fyi/results/css/css-ui/animation/outline-width-interpolation.html https://wpt.fyi/results/css/css-multicol/parsing/column-rule-width-computed.html https://wpt.fyi/results/css/css-multicol/parsing/column-rule-computed.html https://wpt.fyi/results/css/css-backgrounds/animations/border-width-interpolation.html

Flag name on about://flags

No information provided

Finch feature name

DecoupleComputedBorderWidthFromStyle,DecoupleResolvedColumnRuleWidthFromStyleEnabled

Rollout plan

Will ship enabled for all users

Requires code in //chrome?

False

Tracking bug

https://issues.chromium.org/issues/393631108

Estimated milestones

Shipping on desktop	146
Shipping on Android	146
Shipping on WebView	146

Anticipated spec changes

Open questions about a feature may be a source of future web compat or interop issues. Please list open issues (e.g. links to known github issues in the project for the feature specification) whose resolution may introduce web compat/interop risk (e.g., changing to naming or structure of the API in a non-backward-compatible way).

No information provided

Link to entry on the Chrome Platform Status

https://chromestatus.com/feature/5133099851317248?gate=5201902006173696

This intent message was generated by Chrome Platform Status.