mdn / mdn/content

Info about style() container query is misleading

Open Beginner friendly
#44,701 1 comment 2 reactions 0 assignees View on GitHub
Content:Firefox
Dominant language
Markdown
Stars
11k
Forks
23.2k
Avg merge
2d 9h
Merged PRs (30d)
331

Description

### 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 https://github.com/Fyrd/caniuse/issues/6842#issuecomment-2329493806, 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?

* [WebKit's release note restricting to custom properties](https://webkit.org/blog/15865/webkit-features-in-safari-18-0/#:~:text=WebKit%20for%20Safari%2018%2E0%20adds%20support%20for%20Style%20Queries%20when%20testing%20CSS%20Custom%20Properties%2E)
* [Chrome's blog post restricting to custom properties](https://developer.chrome.com/docs/css-ui/style-queries#:~:text=However%2C%20in%20the%20rollout%20of%20this%20feature%2C%20style%20queries%20currently%20only%20work%20with%20CSS%20custom%20property%20values%2E)

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 https://github.com/Fyrd/caniuse/issues/6842.

### MDN metadata

Page report details

* Folder: `en-us/mozilla/firefox/releases/151`
* MDN URL: https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/151
* GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/mozilla/firefox/releases/151/index.md
* Last commit: https://github.com/mdn/content/commit/681ee4beb90b7e0d001f8938df41d5af0f602fe7
* Document last modified: 2026-06-16T14:31:15.000Z

Contributor guide

Open the contributing guide

Research direction

Start with files/en-us/mozilla/firefox/releases/151/index.md and review the linked @container reference and Container size and style queries pages. Update the style() query wording so it clearly states that only custom properties are currently supported, add the requested note to the @container reference, and make the existing guide limitation a separate note block.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
documentation
Issue type
Documentation
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Quiet
Clarity
Clearly specified
Newbie friendliness
78/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.