Skip to main content

property-no-unknown

Disallow unknown properties.

a { height: 100%; }
/** ↑
* This property */

This rule considers at-rules defined in the CSS Specifications, up to and including Editor's Drafts, to be known.

You can filter the CSSTree Syntax Reference to find out what properties are known, and use the languageOptions configuration property to extend it.

This rule ignores:

  • variables, e.g., $sass, @less, --custom-property
  • vendor-prefixed properties, e.g., -moz-overflow-scrolling (unless checkPrefixed is set to true)

Options

true

{
"property-no-unknown": true
}

The following patterns are considered problems:

a {
colr: blue;
}
a {
my-property: 1;
}

The following patterns are not considered problems:

a {
color: green;
}
a {
fill: black;
}
a {
-moz-align-self: center;
}
a {
-webkit-align-self: center;
}
a {
align-self: center;
}

Optional secondary options

ignoreProperties

{ "ignoreProperties": ["array", "of", "properties", "/regex/"] }

Given:

{
"property-no-unknown": [true, { "ignoreProperties": ["/^my-/", "custom"] }]
}

The following patterns are not considered problems:

a {
my-property: 10px;
}
a {
my-other-property: 10px;
}
a {
custom: 10px;
}

ignoreSelectors

{ "ignoreSelectors": ["array", "of", "selectors", "/regex/"] }

Skips checking properties of the given selectors against this rule.

Given:

{
"property-no-unknown": [true, { "ignoreSelectors": [":root"] }]
}

The following patterns are not considered problems:

:root {
my-property: blue;
}

ignoreAtRules

{ "ignoreAtRules": ["array", "of", "at-rules", "/regex/"] }

Ignores properties nested within specified at-rules.

Given:

{
"property-no-unknown": [true, { "ignoreAtRules": ["supports"] }]
}

The following patterns are not considered problems:

@supports (display: grid) {
a {
my-property: 1;
}
}

checkPrefixed

If true, this rule will check vendor-prefixed properties. Defaults to false.

Given:

{
"property-no-unknown": [true, { "checkPrefixed": true }]
}

The following patterns are not considered problems:

a {
-webkit-overflow-scrolling: auto;
}

The following patterns are considered problems:

a {
-moz-overflow-scrolling: center;
}