Skip to main content

selector-max-id

Limit the number of ID selectors in a selector.

    #foo {}
/** ↑
 * This type of selector */

Each selector in a selector list is evaluated separately.

note

In versions prior to 17.0.0, this rule would evaluate functional pseudo-classes separately, such as :not() and :is(), and resolve nested selectors (in a nonstandard way) before counting.

Options​

number​

Specify a maximum universal selectors allowed.

Given:

{
  "selector-max-id": 2
}

The following pattern is considered a problem:

#foo #bar #baz {}

The following patterns are not considered problems:

#foo {}
#foo #bar {}
.foo #foo {}
#foo.foo #bar {}

Optional secondary options​

ignoreContextFunctionalPseudoClasses​

{
  "ignoreContextFunctionalPseudoClasses": [
    "array",
    "of",
    "pseudo-classes",
    "/regex/"
  ]
}

Ignore selectors inside of the specified functional pseudo-classes.

Given:

{
  "selector-max-id": [
    0,
    { "ignoreContextFunctionalPseudoClasses": [":not", "/^:(h|H)as$/"] }
  ]
}

The following patterns are considered problems:

a:is(#foo) {}

The following patterns are not considered problems:

a:not(#foo) {}
a:has(#foo) {}