Skip to main content

unit-no-unknown

Disallow unknown units.

a { width: 100pixels; }
/** ↑
* These units */

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

This rule overlaps with:

We recommend using these rules for CSS and this rule for CSS-like languages, such as SCSS and Less.

Options

true

{
"unit-no-unknown": true
}

The following patterns are considered problems:

a {
width: 10pixels;
}
a {
width: calc(10px + 10pixels);
}

The following patterns are not considered problems:

a {
width: 10px;
}
a {
width: 10Px;
}
a {
width: 10pX;
}
a {
width: calc(10px + 10px);
}

Optional secondary options

ignoreUnits

{ "ignoreUnits": ["array", "of", "units", "/regex/"] }

Given:

{
"unit-no-unknown": [true, { "ignoreUnits": ["/^--foo-/", "--bar"] }]
}

The following patterns are not considered problems:

a {
width: 10--foo--baz;
}
a {
width: 10--bar;
}

ignoreFunctions

{ "ignoreFunctions": ["array", "of", "functions", "/regex/"] }

Given:

{
"unit-no-unknown": [
true,
{ "ignoreFunctions": ["foo", "/^my-/", "/^YOUR-/i"] }
]
}

The following patterns are not considered problems:

a {
width: foo(1x);
}
a {
width: my-func(1x);
}
a {
width: YoUr-func(1x);
}