Re: [csswg-drafts] [css-contain-3] Define a syntax for state-based container queries (#6402)

@mirisuzanne 

> @matthew-dean in terms of syntax and 'pushing state' to CSS, you might be interested in https://github.com/w3c/csswg-drafts/issues/6991 and the linked spec/explainer for our [CSS Toggles proposal](https://css.oddbird.net/toggles/explainer/). I think it lines up pretty well with what you're suggesting in the last two comments.

Oh my god y'all are geniuses. A little different syntax, but yes!!

> But if we only allow you to change descendant styles based on the position of an ancestor in the grid, we avoid that loop. So it does seem like an interesting use-case that might require something container-query-like.

As to the other thing, yeah, I can't quite think of how this would work syntactically, but it feels like there are... I dunno, behaviors? States? Of CSS elements? That are defined / designed to be triggered by other properties.

I just thought of a good allegory, which is a pseudo-element like ::first-line. So it's a selector that is applied once other selectors (and layout) have been applied. So, similarly, I'm thinking of selectors that allow you to select things based on the resulting layout of flexbox / grid. (Not that it's as easy as ::first-line.... although... it would be funny / amazing, if `::first-line` could be applied to flex / grid rows, or similar concepts like `::first-row`, `::nth-row()`, `::last-row`, `::last-column` etc ..... i.e. with old table markup, you could select `:nth-child()`, but there's no way to select implicit rows / columns / etc yet)

-- 
GitHub Notification of comment by matthew-dean
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6402#issuecomment-1095734306 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 12 April 2022 00:32:05 UTC