css - 哪个浏览器适合 css3 flex-box？

Question

在尝试了 css3 flex-box proporty 之后，我很快注意到 Chrome 和 Firefox 中的一些差异。

特别是:如果你在一个应该是 flex 的元素上设置宽度，firefox 会根据需要调整元素，它会考虑宽度样式，但它只是一个变量。

Chrome 会完全尊重 with 样式，

一个例子:

<div id="box">
  <div class="flex-box">Test</div>
  <div class="flex-box">Test Text</div>
</div>

如果框内的 2 个 div 分配了相同的宽度，chrome 会将它们设置为相同的大小。 Firefox 会重新确认第二个 div 需要更多空间，因此它会分配更多空间。

谁是对的？

Answer 1

请记住， flex 不适用于宽度，它适用于确定最小固有宽度后的可用空间。这在几种常见情况下会产生违反直觉的结果，as has been pointed out on the www-style mailing list .我发现，除非您想要 CSS 重新排序或多行(尚未在 Firefox 和 Chrome 中实现)，否则您认为您想要使用 display: box 和box-flex 因为你真的想使用 display: table 和 display: table-cell。

但回到您的实际问题:如果您 set a width in pixels，我发现 Firefox 和 Chrome 显示相同，但如果你不是set a width as a percentage .至于目前哪个浏览器做得正确，可以肯定的是 Firefox 正在实现规范最初的意图，因为原始规范描述了 XUL 属性的作用，而 XUL 属性是这一切的基础。正如其他人所提到的，最终规范是否符合这一初衷尚不得而知。