Skip to main content

no-unreachable-container-intervals

Disallow nested @container intervals that cannot overlap with their parent interval.

Whyโ€‹

A nested interval that is disjoint from the parent condition is dead code and signals a logic bug in the breakpoint plan.

โŒ Incorrectโ€‹

@container layout (width >= 60rem) {
@container layout (width < 40rem) {
.card {
display: grid;
}
}
}

โœ… Correctโ€‹

@container layout (width >= 60rem) {
@container layout (width >= 72rem) {
.card {
display: grid;
}
}
}