- From: Miriam Suzanne via GitHub <sysbot+gh@w3.org>
- Date: Thu, 17 Jun 2021 18:27:47 +0000
- To: public-css-archive@w3.org
mirisuzanne has just created a new issue for https://github.com/w3c/csswg-drafts: == [css-contain-3] Provide a syntax to query a specific container-type == The draft [Container Query spec](https://drafts.csswg.org/css-contain-3/) describes the container query syntax in two parts: ```css @container <<container-name>>? <<container-query-list>> { <<stylesheet>> } ``` Which resolve in two distinct steps: 1. **container selection**: Find the right container to query (nearest ancestor container, after optionally filtering by `<<container-name>>`) 2. **query evaluation**: Evaluate each feature in the `<<container-query-list>>` If no eligible container is selected, the query evaluates to `false`. If the selected container in step 1 is not a valid [container type](https://drafts.csswg.org/css-contain-3/#container-type) for the query features used in step 2, then the query evaluates to `unknown`. For example, if we try to query a `block-size` container-type about its `inline` dimensions, that measurement is unknown. That means authors will likely _also_ want to filter and select containers based on container type – eg find the nearest `inline-size` container in step 1, in order to query its `width` in step 2. And, since a `<<container-query-list>>` could combine multiple different features, we might need to select for more than one container type. Since container-names are custom identifiers, and container types are built-in keywords (with potential for new additions later on) we'll need some way to distinguish them — either by requiring dashed-idents for names (not a great option), or by adding distinct syntax for selecting each one in the `@container` rule. Something like: ```css @container <<container-name>>? type(<<container-type>>+)? <<container-query-list>> { <<stylesheet>> } @container sidebar type(inline-size style) (width > 30em) and (--card: small) { <<stylesheet>> } ``` - Is there a better approach than adding a `type()` function, or a better name for that function? - Do we need clearer delineation between the selection & query aspects of the `@container` rule? Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6393 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 17 June 2021 18:27:59 UTC