CSS Calc返回0,但在我的小提琴中工作

时间:2015-03-18 15:28:28

标签: html css css3 less

我正在尝试使用css3 calc,但它返回0%。

width: calc(100% - 100px);

在我的本地机器上使用它,然后检查它显示的元素:

width: calc(0%);

当我把它放在小提琴中时,它似乎正在起作用。

正在工作的部分是蓝色内容div是侧边栏旁边的正确宽度,而在我的本地,内容div的宽度为0%。它显示div中的内容,但不显示蓝色的背景颜色。

Fiddle

有什么理由计算会返回0吗?我使用的是最新版本的firefox。

我已经查找了calc的替代方案,除了javascript之外,没有其他方法适合我的需求。但我想避免这种方法。非常感谢任何帮助。

值得注意的是我正在使用Less

1 个答案:

答案 0 :(得分:7)

你需要逃避calc

尝试:width: ~"calc(100% - 100px)";

N.b。在jsfiddle上尝试jsbin。它可以让你使用sass更少。