获得Firefox和Safari的CSS calc()中的百分比？

Question

我正在使用以下calc()方程来计算两个div的宽度:

CSS

.MyClass {
    width: calc((100% - 800px) / 2);
    width: -moz-calc((100% - 800px) / 2);
    width: -webkit-calc((100% - 800px) / 2);
}

这适用于Chrome和IE,但不适用于Firefox和Safari.我注意到Firefox似乎无法解释百分比.例如,以下内容将显示正常:

CSS

width: calc((1000px - 800px) / 2);

有什么建议？

谢谢.

更新

所以我的预处理器正在创建看起来像这样的css:

SCSS

.MyClass {
    width: calc( ( 100% - #{$WrapperWidth} ) / 2 ) ;
    width: -moz-calc( ( 100% - #{$WrapperWidth} ) / 2 ) ;
    width: -webkit-calc( ( 100% - #{$WrapperWidth} ) / 2 ) ;
}

CSS

.MyClass {
  width: calc( ( 100% - 800px ) / 2);
  width: -moz-calc(100%-800px/2);
  width: -webkit-calc(100%-800px/2);
}

我试过纠正它但它似乎仍然无法正常工作.浏览器中的代码仍然是:

width: calc((100% - 800px) / 2);

它似乎没有读取-moz-calc.

Answer 1

尤里卡.几天来,我一直在忙着这件事.最后发现,100vh而不是关闭100%,将使其与大多数浏览器.

height: calc(100vh - 100px);

代替

height: calc(100% - 100px);

最后,现在我可以继续我的项目了.