在最近的一个项目中,我使用calc函数计算宽度犯了一个错,一个很有趣的错误。在css里我写了下面的代码:
width: calc(100%-351px);
但它没有按我与预期设计生效,而且,在浏览器的debug工具里显示,这句代码是有误的。很奇怪,浏览器是最新版的谷歌浏览器,肯定是支持这个css3特征。
没有生效,这是为什么呢?
在谷歌浏览器:
发现这里有个需要注意的地方就是在进行加减运算的时候,必须在运算符前后加空格。
width: calc(100% - 351px);