Skip to content

Clarify container queries always use content box (fix #40306) #40450

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 6 commits into from
Jul 27, 2025
Merged

Clarify container queries always use content box (fix #40306) #40450

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
f76f18f
Clarify container queries always use content box (fix #40306)
Shrinivassab Jul 20, 2025
bc11656
Apply suggestions from code review
estelle Jul 23, 2025
6d59771
Added the changes in one place
Shrinivassab Jul 27, 2025
c9204f8
Merge branch 'main' into 40306-fix-container-box-size-clarification
Shrinivassab Jul 27, 2025
e2d011f
Merge branch 'main' into 40306-fix-container-box-size-clarification
Shrinivassab Jul 27, 2025
248964c
Merge branch '40306-fix-container-box-size-clarification' of https://…
Shrinivassab Jul 27, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion files/en-us/web/css/@container/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -127,7 +127,7 @@ The `<container-condition>` queries include [size](#size_container_descriptors)

#### Size container descriptors

The `<container-condition>` can include one or more boolean size queries, each within a set of parentheses. A size query includes a size descriptor, a value, and — depending on the descriptor — a comparison operator. The syntax for including multiple conditions is the same as for [`@media`](/en-US/docs/Web/CSS/@media) size feature queries.
The `<container-condition>` can include one or more boolean size queries, each within a set of parentheses. A size query includes a size descriptor, a value, and — depending on the descriptor — a comparison operator. The queries always measures the [content box](/en-US/docs/Web/CSS/box-edge#content-box) as the comparison. The syntax for including multiple conditions is the same as for [`@media`](/en-US/docs/Web/CSS/@media) size feature queries.

```css
@container (min-width: 400px) {
Expand Down