Skip to main content

selector-max-type

Limit the number of type selectors in a selector.

    a {}
/** ↑
* 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 type selectors allowed.

Given:

{
"selector-max-type": 2
}

The following pattern is considered a problem:

div a span {}

The following patterns are not considered problems:

div {}
div a {}
.foo div a {}
div.foo a {}

Optional secondary options

ignore

{ "ignore": ["array", "of", "options"] }

"child"

Discount child type selectors.

Given:

{
"selector-max-type": [2, { "ignore": ["child"] }]
}

The following patterns are not considered problems:

div span > a {}
#bar div span > a {}

"compounded"

Discount compounded type selectors -- i.e. type selectors chained with other selectors.

Given:

{
"selector-max-type": [2, { "ignore": ["compounded"] }]
}

The following patterns are not considered problems:

div span a.foo {}
div span a#bar {}

"custom-elements"

Discount custom elements.

Given:

{
"selector-max-type": [2, { "ignore": ["custom-elements"] }]
}

The following pattern is not considered a problem:

div a foo-bar {}

"descendant"

Discount descendant type selectors.

Given:

{
"selector-max-type": [2, { "ignore": ["descendant"] }]
}

The following patterns are not considered problems:

.foo div span a {}
#bar div span a {}

"next-sibling"

Discount next-sibling type selectors.

Given:

{
"selector-max-type": [2, { "ignore": ["next-sibling"] }]
}

The following patterns are not considered problems:

div a + span {}
#bar + div + span + a + span {}

ignoreTypes

{ "ignoreTypes": ["array", "of", "types", "/regex/"] }

Given:

{
"selector-max-type": [2, { "ignoreTypes": ["/^my-/", "custom"] }]
}

The following patterns are not considered problems:

div a custom {}
div a my-type {}
div a my-other-type {}