Skip to content

Info about style() container query is misleading #44701

Description

@SebastianZ

MDN URL

https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/151

What specific section or headline is this issue about?

CSS

What information was incorrect, unhelpful, or incomplete?

The note currently says this: "The @container CSS at-rule supports style() queries. This allows you to check if a container has a valid CSS declaration, a CSS property, or a custom property, and apply styles to its children accordingly."

From a spec standpoint, that statement is correct. Though neither Firefox nor any other browser engine currently support style() queries for standard CSS properties.

What did you expect to see?

Browsers only support style() queries for custom properties, at the moment. And, as @mirisuzanne noted in Fyrd/caniuse#6842 (comment), this will stay the case for the forseeable future.

So the note should clearly state that only custom properties are currently supported.

There should also be a note at https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/At-rules/@container regarding this. And the sentence at https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Containment/Container_size_and_style_queries#container_style_queries:~:text=The%20only%20style%20feature%20currently%20supported%20is%20custom%20properties%2C%20with%20or%20without%20a%20value%2E might be moved into a separate note block to make it clear what to expect.

Sebastian

Do you have any supporting links, references, or citations?

Here's a test case to verify this:

https://codepen.io/editor/SebastianZ1983/pen/019f4e31-6c32-7217-8025-dc5ea8139d41

Do you have anything more you want to share?

This also affects a discussion about how to present the support of this feature at caniuse.com, see Fyrd/caniuse#6842.

MDN metadata

Page report details

Metadata

Metadata

Assignees

No one assigned

    Labels

    Content:CSSCascading Style Sheets docsContent:FirefoxContent in the Mozilla/Firefox subtreeneeds triageTriage needed by staff and/or partners. Automatically applied when an issue is opened.

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions