Description
Edit: The rationale below is wrong, but the proposal still stands, see #9192 (comment)
While we have a resolution in #7858 to add a function for every container query unit that allow to reference a named container, there is a much more lightweight way that can be implemented right away to make these use cases a little less annoying: making the <query> part of container queries optional.
This is real code I had to write yesterday:
@container word-card (width < 100vw) {
height: min(100cqw / var(--total-aspect-ratio), 40vh);
}The entire reason this container query exists, is to allow me to use cqw units for that particular named container. The (width < 100vw) query is only there because omitting it would render the rule invalid, as the spec makes this part mandatory.
<container-condition> = [ <container-name> ]? <container-query>
Can we just make it optional?
If we’re fine with allowing entirely bare @container {} rules, the change could be as simple as:
<container-condition> = [ <container-name> ]? <container-query>?
if we want at least name OR condition, it would be:
<container-condition> = [ <container-name>? <container-query>? ]!
Metadata
Metadata
Assignees
Labels
Type
Projects
Status
Status