当子具有%宽度时,-moz-box不起作用

Question

我们使用display:-moz-box/-webkit-box将div垂直居中于另一个div中.如果它在子div具有绝对宽度时有效,则当孩子的宽度只是百分比时,它在Firefox上不是正确的渲染器.

<div style="background:yellow;height:40px;display:-moz-box;-moz-box-pack:center;
-moz-box-align:center;display:-webkit-box;-webkit-box-pack:center;
-webkit-box-align:center">
    <div style="width:70%;background:blue;text-align:center">
        Hello World
    </div>
 </div> 

铬

火狐

这是一个演示问题的小提琴:http: //jsfiddle.net/sBdWW/

任何帮助将被赞赏干杯

Answer 1

您使用的是过时的flexbox规范.

• 关于MDN的新flexbox文章
• W3C CSS Flexbox CR
• JSFiddle,似乎适用于Firefox 23和Chrome 28