&引用；大众汽车；Chrome中calc中的CSS单位不工作

新的

vw

（和

vh

，

vmin

和

vmax

）CSS单元非常有用，就像

calc

一样。两者都可以在Chrome中正常工作（后者的前缀为

-webkit calc

），但出于某种原因，我发现

calc

属性值包括

v*

单位，例如

width:-webkit calc（95vw-25em）

会产生无效的属性值。这是一个尚未实现的bug，还是规范，还是一个bug？

这是一个bug，注册为-calc不使用视口单位。

这是一个旧bug，已经被修复了很久，但是如果您仍然支持旧版本的chrome，并且在您支持的Android平板电脑中的旧版本chrome中特别遇到了这个bug（就像我的情况一样），这里有一个简单的方法可以绕过这个bug：

使用覆盖目标VW的包装器，然后使用100%，而不是使用calc（…）中的视口单位

html:

---

规范允许在

calc

中使用

vw

，甚至在那里的一个示例中使用了它：这是Chrome中的一个bug，但现在已经修复了bug修复了吗？我必须使用它，或者是另一种方法，我找不到其他方法…@Samoth，据我所知不是这样。在Chrome 31.0.1650.57 m中，我刚刚遇到了这个问题。正确，这个Chrome bug I这仍然是一个bug，目前尚未解决。看起来这是秘密修复的-至少对我来说它似乎在开发频道工作。根据当前的情况，它必须是

xxxxx px

。

<div class="container">
    <div class="inner-calc-with-viewport-units-bugged" />
</div>

.container { 
    width: 100vw; //or height: 100vh, depending on your usecase
}
.inner-calc-with-viewport-units-bugged { 
    width: calc(100% - XXXXX px); //or height: calc(100% - XXpx);
}