@@ -622,6 +622,14 @@ Naming Query Containers: the 'container-name' property</h3>
622
622
.card { margin-inline: 2em; }
623
623
}
624
624
</pre>
625
+
626
+ It is also possible to query for a container only based on its name.
627
+
628
+ <pre class=lang-css>
629
+ @container my-page-layout {
630
+ .card { padding: 1em; }
631
+ }
632
+ </pre>
625
633
</div>
626
634
627
635
@@ -923,7 +931,7 @@ Container Queries: the ''@container'' rule</h3>
923
931
where:
924
932
925
933
<pre class="prod def">
926
- <dfn><<container-condition>></dfn> = [ <<container-name>> ] ? <<container-query>>
934
+ <dfn><<container-condition>></dfn> = [ <<container-name>> ? <<container-query>> ? ]!
927
935
<dfn><<container-name>></dfn> = <<custom-ident>>
928
936
<dfn><<container-query>></dfn> = not <<query-in-parens>>
929
937
| <<query-in-parens>> [ [ and <<query-in-parens>> ]* | [ or <<query-in-parens>> ]* ]
@@ -959,8 +967,7 @@ Container Queries: the ''@container'' rule</h3>
959
967
in the <<container-query>> . If the <<container-query>> contains
960
968
unknown or unsupported [=container feature=] s,
961
969
no [=query container=] will be selected for that <<container-condition>> .
962
- The optional <<container-name>>
963
- filters the set of [=query containers=] considered
970
+ The <<container-name>> filters the set of [=query containers=] considered
964
971
to just those with a matching [=query container name=] .
965
972
966
973
Once an eligible [=query container=] has been selected for an element,
@@ -969,6 +976,8 @@ Container Queries: the ''@container'' rule</h3>
969
976
If no ancestor is an eligible [=query container=] ,
970
977
then the [=container query=] is ''unknown'' for that element.
971
978
As with media queries, <<general-enclosed>> evaluates to ''unknown'' .
979
+ If the <<container-query>> is omitted, the [=query container=] is eligible as
980
+ long as the <<container-name>> matches.
972
981
973
982
If a [=container query=] includes multiple <<container-condition>> s,
974
983
each condition will select it's own [=query container=] ,
0 commit comments