设置display: -moz-box使元素在Firefox中使用边框大小



我遇到了一个问题,通过设置元素的显示属性为display: -moz-box导致该元素在Firefox中开始使用border-box大小模型,即元素的宽度和高度包括padding和border。这在基于Webkit的浏览器中不会发生。

这里是JSFiddle的链接,说明了我所说的:http://jsfiddle.net/S3BCa/

我想知道这是否是Firefox中的一个bug(如果是的话,似乎找不到任何关于它的文档),或者是否有一个解决方案可以使所有浏览器都保持一致?

是的,这是一个bug,目前只有border-box被实现。这是有历史原因的,灵活盒模型最初仅为XUL实现,border-box是唯一支持的分级模型。相关的bug是bug 73669和bug 490359, bug 635692表明了一些额外的问题。我猜这最终会在-moz前缀被删除之前修复,但是不知道什么时候会。

目前,在不同浏览器之间获得一致行为的唯一选择是指定box-sizing: border-box。对不起,我认为没有更好的解决办法了。

最新更新