Ff151 CSSContainerRules.conditions docs

[hamishwillee]

This adds docs for CSSContainerRules.conditions that will be supported from FF151.

This is quite difficult to do (i.e. a compromise) because conditions is a spec update that supersedes the old containerQuery and containerName. It provides support for multiple container conditions in a container rule, mirroring changes to @container.
SO you have this new thing that you should use, but it won't work in older browsers. Further, if you try create an @container that has multiple container queries that will silently fail in the CSS, but when you try access the rule in code you'll get an undefined instead of CSSContainerRules.

Upshot, changes to the meanings of all the variables even though not yet broad browser support. I have tried to do this by reflecting the current spec and adding clear notes about the issues.

@dletorey You're doing the corresponding @container work in #43862. Some of this might change a bit based on how you create your definitions - i.e. I'd link to specific parts of your docs rather than making my own terms if there were link targets.
Would appreciate you scanning this at least!

Related cocs works can be tracked in #43864

[github-actions]

Preview URLs (4 pages)

• /en-US/docs/Web/API/CSSContainerRule/conditions
• /en-US/docs/Web/API/CSSContainerRule/containerName
• /en-US/docs/Web/API/CSSContainerRule/containerQuery
• /en-US/docs/Web/API/CSSContainerRule

(comment last updated: 2026-05-08 04:23:19)

[dletorey]

Looks good to me.

[chrisdavidmills]

@hamishwillee mostly looking good, but I've thrown a few comments at you.

[hamishwillee]

Thanks for the review @chrisdavidmills ! Ready for another look. Accepted almost everything and tried to roll it out.

[chrisdavidmills]

@hamishwillee a bunch more comments for you, sorry about that! This is mostly just grammar stuff now.

[chrisdavidmills]

Suggested change

	> On browsers that don't support `conditions`, you may be able to use {{domxref("CSSContainerRule.containerName")}} and {{domxref("CSSContainerRule.containerQuery")}}, provided that the `@container` only specifies one container condition.
	> In browsers that don't support `conditions`, you may be able to use {{domxref("CSSContainerRule.containerName")}} and {{domxref("CSSContainerRule.containerQuery")}} to return container name and query information, provided that the `@container` only specifies one container condition.

[hamishwillee]

Thanks very much for the exhaustive (ing?) review @chrisdavidmills . I've accepted all, pretty much without change.