Using modulus in css calc function

问题

Is there any way to use or implement modulus operator in css calc function?
I know there is mod operator and IE supports it, but what about other browsers?

For example

#element-id{
     width: calc( 100%  mod 5 );
}

回答1:

Unfortunately, there is no more mention of the mod operator in recent specs.

The calc() function allows mathematical expressions with addition (+), subtraction (-), multiplication (*), and division (/) to be used as component values.

You may want to resort to using javascript to achieve such behaviour.

var el = document.getElementById('element-id');
el.style.width = (100 % 5) + '%';

回答2:

Simply..."NO".

MDN

The expression can be any simple expression combining the following operators, using standard operator precedence rules:

+ Addition.

- Subtraction.

* Multiplication. At least one of the arguments must be a <number>.

/ Division. The right-hand side must be a <number>.

回答3:

This operator is no longer supported in browsers. You can only use standard operations with calc:

addition +
subtraction -
multiplication *
division /

This calc() article provides a further detailed explanation on the function.

回答4:

Only Internet Explorer supports the mod function, I'm afraid, and it has been dropped from the CSS spec, so other browsers are not likely to support it any time soon.

来源：https://stackoverflow.com/questions/34435330/using-modulus-in-css-calc-function

标签

css

css3

css-calc