@@ -565,30 +565,30 @@ Container Queries: the ''@container'' rule</h3>
565
565
to only match when the [=container query=]
566
566
is true for their element’s [=query container=] .
567
567
568
-
569
568
The syntax of the ''@container'' rule is:
570
569
571
570
<pre class="prod def">
572
- @container [ <<container-name>> ]? <<container-query >> {
573
- <<stylesheet>>
571
+ @container [ <<container-name>> ]? <<container-condition >> {
572
+ <<stylesheet>>
574
573
}
575
574
</pre>
576
575
577
576
where:
578
577
579
578
<pre class="prod def">
580
- <dfn><<container-query>></dfn> = ( <<container-condition>> )
579
+ <dfn><<container-condition>></dfn> = not <<query-in-parens>>
580
+ | <<query-in-parens>> [ [ and <<query-in-parens>> ]* | [ or <<query-in-parens>> ]* ]
581
+ <dfn><<query-in-parens>></dfn> = ( <<container-condition>> )
581
582
| ( <<size-feature>> )
582
583
| style( <<style-query>> )
583
584
| <<general-enclosed>>
584
- <dfn><<container-condition>></dfn> = not <<container-query>>
585
- | <<container-query>> [ and <<container-query>> ]*
586
- | <<container-query>> [ or <<container-query>> ]*
587
-
588
- <dfn><<style-query>></dfn> = <<style-feature>> | <<style-condition>>
589
- <dfn><<style-condition>></dfn> = not ( <<style-query>> )
590
- | ( <<style-query>> ) [ and ( <<style-query>> ) ]*
591
- | ( <<style-query>> ) [ or ( <<style-query>> ) ]*
585
+
586
+ <dfn><<style-query>></dfn> = <<style-condition>> | <<style-feature>>
587
+ <dfn><<style-condition>></dfn> = not <<style-in-parens>>
588
+ | <<style-in-parens>> [ [ and <<style-in-parens>> ]* | [ or <<style-in-parens>> ]* ]
589
+ <dfn><<style-in-parens>></dfn> = ( <<style-condition>> )
590
+ | ( <<style-feature>> )
591
+ | <<general-enclosed>>
592
592
</pre>
593
593
594
594
@@ -1012,6 +1012,8 @@ Changes since the 21 December 2021 First Public Working Draft</h3>
1012
1012
1013
1013
Significant changes since the <a href="https://www.w3.org/TR/2021/WD-css-contain-3-20211221/">21 December 2021 First Public Working Draft</a> include:
1014
1014
1015
+ * Clarify the syntax of syntax of the ''@container'' rule
1016
+ to appropriately handle parenthesis.
1015
1017
* Remove the <<string>> option from the 'container-name' syntax.
1016
1018
Container names must be <<custom-ident>> s.
1017
1019
(<a href="https://github.com/w3c/csswg-drafts/issues/6405">Issue 6405</a> )
0 commit comments