- From: Dean Leigh via GitHub <sysbot+gh@w3.org>
- Date: Sun, 27 Mar 2022 20:59:02 +0000
- To: public-css-archive@w3.org
> for it to respond to your style you'd have to query the style like so:
>
> ```css
> .feature__menu {
> & .feature-layout__group {
> container-type: style;
> ...
> @container style(justify-content: space-between) {
> /* add Extra Styles that only apply when this element has justify-content set to space-between */
> ...
> }
> }
> }
> ```
>
> because your existing system is adding `justify-content: space-between` when the data attribute is on the parent, those Extra Styles will only[1] be there when your feature__menu element has `data-screen-col_12` attribute containing `justify-content:space-between;`
>
> If you need to add more styes only based on the data attribute selector though, you can add more styles the same way you're already adding `justify-content: space-between` and don't need a style container query.
>
> [1] unless something else will set justify-content to space-between too
Finally got around to testing this but with no luck:
[](https://codepen.io/deanleigh/pen/YzYVGKp?editors=1000)
--
GitHub Notification of comment by deanleigh
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6396#issuecomment-1080017906 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Sunday, 27 March 2022 20:59:06 UTC