在Chrome(版本68)的媒体查询中使用calc()
似乎将视口单位替换为px
。例如
@media only screen and (min-height: calc(100vw + 10px))
产生
@media only screen and (min-height: 110px)
Firefox能够正确处理它,并且在媒体查询中(根据mozilla,不支持calc()
的IE,Edge和Safari)似乎忽略了对我的用例更好的查询。
如何在适当支持的浏览器中应用媒体查询+ calc()?我是否应该期望Firefox继续以这种方式支持calc()
?
用例:在正方形的画布上填充视口的游戏中,根据可用空间,签名应出现在画布(默认值)或视口的右下角。