問題:
在具有兩列的Flexbox 佈局中,如何不同尺寸的元素是否可以分佈以填充整個可訪問區域,而不是與最高的元素具有相同的高度element?
上下文:
使用flexbox的flex-wrap屬性,我們可以將元素包裝到多行。但是,預設情況下,行中的所有元素往往與該行中最高的元素具有相同的高度。如果我們希望元素保持其自然高度,這可能是不可取的。
範例:
考慮以下程式碼:
#container { width: 800px; display: flex; flex-wrap: wrap; } .cell { width: 300px; flex: 1 auto; }
答案:
答案:#container { width: 800px; display: flex; flex-wrap: wrap; align-items: flex-start; }
以上是如何讓 Flexbox 兒童利用可用空間來劃分不同的高度?的詳細內容。更多資訊請關注PHP中文網其他相關文章!