Re: [csswg-drafts] [css-cascade-5] Proposal to disallow interleaving of @layer and @import rules (#6522)

Thanks for the clarifications on that, @mirisuzanne. Think I get it now:

/* EXAMPLE 31 */
@layer default;
@import url(theme.css) layer(theme);
@layer components; /* 👈 This @layer statement here will make all subsequent @import rules be ignored. In this example however there are none */

@layer default {
  audio[controls] {
    display: block;

I see that in you changed the text to “A ''@layer'' rule that comes after …”. More precise would be “A ''@layer'' statement at-rule that comes after …”?


Winging back to “the @layer block at-rule” described just above it. There it reads in a note:

> Note: @layer block at-rules cannot be interleaved with @import rules.

Is that 1 @import rule in between two @layers block at-rules? If so, I somewhat read between the lines that best practice that's being hinted at is to:
1. Establish a layer order upfront using `@layer` statement at-rules
1. Group your `@import`s after that
1. Append styles to already established layers using `@layer` block at-rules

Would that be something to recommend people to do?


_(Apologies if I'm asking too many stupid questions regarding this. Trying to understand things correctly here. Perhaps some code-examples of what is meant by all those limitations could help?  In css-nesting-1 for example I see a lot of these “wrong examples“ with an explanation of what exactly is wrong added to them.)_

GitHub Notification of comment by bramus
Please view or discuss this issue at using your GitHub account

Sent via github-notify-ml as configured in

Received on Tuesday, 31 August 2021 21:32:35 UTC