Skip to main content

function-calc-no-unspaced-operator

Disallow invalid unspaced operator within math functions, such as calc() or min().

a { top: calc(1px + 2px); }
/**               ↑
 * The space around this operator */

This rule checks that there is a single whitespace or a newline plus indentation before the + or - operator, and a single whitespace or a newline after that operator.

The fix option can automatically fix all of the problems reported by this rule.

The message secondary option can accept arguments.

Options​

true​

The following patterns are considered problems:

a { top: calc(1px+2px); }
a { top: calc(1px+ 2px); }
a { transform: rotate(atan(-2+1)); }

The following patterns are not considered problems:

a { top: calc(1px + 2px); }
a { top: calc(calc(1em * 2) / 3); }
a { top: calc(calc(1em*2)/3); }
a {
  top: calc(var(--foo) +
    var(--bar));
}
a {
  top: calc(var(--foo)
    + var(--bar));
}