declaration-property-max-values

Limit the number of values for a list of properties within declarations.

a { margin: 1px 2px 3px 4px; }
/**         ↑   ↑   ↑   ↑
 *          These values */

Use this rule to enforce a convention. For example, limit:

• /^(margin|padding)$/ to 2 values, as four-value forms are easy to misread
• font-family to 3 values, so that font stacks stay short

This rule supports 2 message arguments: the property name and the configured maximum.

Options

Object<string, number>

{ "property-name": 0 }

Specify pairs of a property and a max value. In practice, you should specify any positive integers as max values.

You can specify a regex for a property name, such as { "/^margin/": 0 }.

Given:

{
  "declaration-property-max-values": {
    "border": 2,
    "/^margin/": 1,
    "/(-webkit-)?transform$/": 1
  }
}

The following patterns are considered problems:

a { border: 1px solid blue; }

a { margin: 1px 2px; }

a { margin-inline: 1px 2px; }

a { -webkit-transform: scale(1) rotate(30deg); }

The following patterns are not considered problems:

a { border: 1px solid; }

a { margin: 1px; }

a { margin-inline: 1px; }

a { -webkit-transform: scale(1); }