Web-Facing Change PSA: CSS @container with unsupported Features never match

[Rune Lillesveen]

Contact emails

fut...@chromium.org

Specification

https://drafts.csswg.org/css-contain-3/#container-rule

Summary

@container selectors that contain unsupported queries will never select any containers, meaning they will never match. That means this query will never match any container even if there is a size container that will match the width query that would otherwise make the selector match in cases like this: @container (width > 0px) or (unknown) {} This is a recent change to the specification to avoid forward-compatibility issues.

Blink component

Blink>CSS

TAG review

None

TAG review status

Not applicable

Risks

Interoperability and Compatibility

Compatibiilty risk low as use counter shows a very low instance of unsupported container queries used in Chrome (0.000003%): https://chromestatus.com/metrics/feature/timeline/popularity/4596 There is a much larger risk in not shipping this spec change (which motivated the spec change: https://github.com/w3c/csswg-drafts/issues/7551)

Gecko: No signal

Reported Gecko bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1874687

WebKit: No signal

Reported WebKit bug: https://bugs.webkit.org/show_bug.cgi?id=267535

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?

None

Debuggability

None

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/css/css-contain/container-queries/container-selection-unknown-features.html https://wpt.fyi/css/css-contain/container-queries/query-evaluation.html https://wpt.fyi/css/css-contain/container-queries/query-evaluation-style.html

Flag name on chrome://flags

#enable-experimental-web-platform-features

Finch feature name

CSSUnknownContainerQueriesNoSelection

Requires code in //chrome?

False

Estimated milestones

Shipping on desktop	122
DevTrial on desktop	122

Shipping on Android	122
DevTrial on Android	122

Shipping on WebView

122

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).

None

Link to entry on the Chrome Platform Status

https://chromestatus.com/feature/5105423604776960

This intent message was generated by Chrome Platform Status.

--

Rune Lillesveen