為什麼 Flexbox 不能如預期般使用 `` 元素？

為什麼

抵抗Flexbox

將Flex 顯示器應用於

時元素，在Firefox 和Chrome 等瀏覽器中會出現意外行為。 Flex 的行為類似於 block，而 inline-flex 的行為類似於 inline-block，儘管規範沒有指示對

進行任何特殊處理。

原因

根據 Bug 984869、

以及 和 不能完全在純 CSS 中實現，因此充當黑盒。這意味著它們可能不會對其他 CSS 樣式元素做出相同的回應。

具體而言，對於

，瀏覽器使用預定的框架類別來呈現它，該框架類別控制其子元素的佈局。此框架類別會覆寫 CSS 中設定的顯示屬性。

最佳實踐

在

中實現所需的佈局跨瀏覽器，建議使用包裝器

在

中，類似於在

中的操作。

Firefox 更新

Firefox 版本 46 及更高版本為

實作 Flexbox fieldset>，解決 Bug 1230207。