為什麼Fieldset 元素不像Flex 容器
使用display: flex 或display: inline-flex 設定fieldset 元素的樣式可能會讓您摸不著頭腦,因為它的行為與預期不同。它不是充當靈活的容器,而是分別與區塊或內聯塊元素類似。
錯誤或預期行為?
Firefox 和 Chrome 中的此行為(雖然令人驚訝地在 IE 中工作)不是一個錯誤。根據 Bug 984869,按鈕元素是透過特殊處理呈現的,並且可能會忽略諸如顯示之類的 CSS 屬性。這種行為並不是按鈕所獨有的。 fieldset、table 和 del 元素也表現出類似的渲染異常。
解決方案
按照CSS 靈活框佈局中的指定可靠地佈局fieldset 元素的子元素,您需要使用一種解決方法:將子元素包裝在字段集中的div 容器內。這種方法在所有瀏覽器中都能一致地工作,確保在所有情況下都能獲得所需的佈局。
Firefox 46 及更高版本
但是,對於Firefox 用戶來說有個好消息:Firefox 46 及更高版本實現支援Fieldset 元素的Flexbox(請參見錯誤1230207)。這意味著您可以在字段集上使用 display: flex 而無需解決方法。
以上是為什麼 `display: flex` 不適用於 `` 元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!