[csswg-drafts] [css-nesting-1] CSSOM for nested media query rules (#7850)

sesse has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-nesting-1] CSSOM for nested media query rules ==
What should the CSSOM look like for this snippet?

div {
  color: red;
  @media-query(min-width > 100px) {
    color: green;
    & span {
      color: blue;
    }
  }
}

Specifically, where does the “color: green;” go? It cannot be on the media query rule, because those do not support containing CSS properties. One could say there's an implicit & {} CSSStyleRule (the example says the syntax is “equivalent” to that, though the standard text does not specify it, just that the properties “\[apply\] to the same elements as the parent rule”), but if so, would the “& span” rule be a subrule of that implicit & {} rule, or would it lie under the media query rule? How would it serialize?

What about if the “color: green” is removed, so there are no properties under the @media-query? Would that change anything, or would there still be a & {} rule?

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7850 using your GitHub account


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

Received on Friday, 7 October 2022 13:40:26 UTC