Skip to main content

declaration-no-important

Disallow !important within declarations.

a { color: pink !important; }
/**             ↑
 * This !important */

Use this rule to enforce a convention, as !important can make styles harder to override. With cascade layers, !important in an earlier layer wins over later layers, which can be the intent.

If you always want !important in your declarations, e.g. if you're writing user styles, you can safely add them using postcss-safe-important.

This rule doesn't have any message arguments.

Options​

true​

{
  "declaration-no-important": true
}

The following patterns are considered problems:

a { color: pink !important; }
a { color: pink ! important; }
a { color: pink!important; }

The following patterns are not considered problems:

a { color: pink; }