Style Container Queries (for custom properties)

[lilles]

Request for position on an emerging web specification

• WebKittens who can provide input: @anttijk @jensimmons

Information about the spec

• Spec Title: CSS Containment Module Level 3
• Spec URL: https://drafts.csswg.org/css-contain-3/#style-container
• Issue Tracker (if not the repository's issue tracker): https://github.com/w3c/csswg-drafts/labels/css-contain-3
• Explainer (if not README.md in the repository): https://github.com/oddbird/css-sandbox/blob/main/src/rwd/query/explainer.md

Design reviews and vendor positions

• TAG Design Review: Early design review of CSS Container Queries proposal w3ctag/design-reviews#592
• Mozilla standards-positions issue: Style Container Queries (for custom properties) mozilla/standards-positions#686

Anything else we need to know

Style queries can be used to style an element based on querying the computed style values of a parent element or a named ancestor element.

Chrome currently has an implementation for custom property queries behind a flag, and it would be good to have separate positions on custom and standard property queries if applicable.

[nt1m]

We are generally supportive of the CSS variables use case. For general CSS properties however, there is currently no concept of computed value equality in WebKit, so the position would depend on how significant the use-cases are, given the less trivial amount of work.

[lilles]

Regarding standard property queries, I've left a comment here:

w3c/csswg-drafts#7185 (comment)