CSS calc（）不工作 [英] CSS calc() not working

问题描述

CSS calc（）函数中有多少操作数有限制？

Is there a limit to how many operands you can have within a CSS calc() function?

这个工作原理：

div {
    left:calc((100%/54)*26);
    left:-webkit-calc((100%/54)*26);
}

这不起作用：

div {
    left:calc(((100%/54)*14)-140px);
    left:-webkit-calc(((100%/54)*14)-140px);
}

当然，后者是我需要的，几个像素，但一旦我尝试这样做，值似乎只是零。

Of course, the latter is what I need, because I need to offset a few pixels, but as soon as I try to do that, the value seems to just go to zero. Any insight is appreciated!

推荐答案

引用 MDN

code>和 - 运算符必须始终包含空格。例如， calc（50％-8px）的
操作数将被解析为百分比
，后跟负长度，无效的表达式，而 calc（50％ - 8px）的
操作数是百分比，后跟减号
和长度。运算符不需要空格，但
允许添加它以保持一致性，并且建议使用 * 和 / 。

The + and - operators must always be surrounded by whitespace. The operand of calc(50% -8px) for instance will be parsed as a percentage followed by a negative length, an invalid expression, while the operand of calc(50% - 8px) is a percentage followed by a minus sign and a length. The * and / operators do not require whitespace, but adding it for consistency is allowed, and recommended.

将你的东西空间化，可能会奏效。

Space your stuff out, and it will probably work.

这篇关于CSS calc（）不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！