nesting-selector-no-missing-scoping-root

Disallow missing scoping root for nesting selectors.

    & {}
/** ↑
 * This nesting selector */

CSS nesting selectors (&) represent the parent selector in nested CSS. When used at the top level or within certain at-rules without a scoping root, they can cause unexpected behavior or indicate a mistake in the CSS structure.

Options

true

{
  "nesting-selector-no-missing-scoping-root": true
}

The following patterns are considered problems:

& {}

@media all {
  & {}
}

@scope (&) {}

The following patterns are not considered problems:

a {
  & {}
}

a {
  @media all {
    & {}
  }
}

a {
  @scope (&) {}
}