在Flex容器中等高行如您所見,list-items在第一個row有同樣的height..但是第二個項目row有不同heights..我要所有的物品都有制服height.有沒有辦法做到這一點而不付出定高而且只使用撓曲箱?enter image description here這是我的code.list { display: flex; flex-wrap: wrap; max-width: 500px;}.list-item { background-color: #ccc; display: flex; padding: 0.5em; width: 25%; margin-right: 1%; margin-bottom: 20px;}.list-content { width: 100%;}<ul class="list"> <li class="list-item"> <div class="list-content"> <h2>box 1</h2> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p> </div> </li> <li class="list-item"> <div class="list-content"> <h3>box 2</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p> </div> </li> <li class="list-item"> <div class="list-content"> <h3>box 2</h3> <p>Lorem ipsum dolor</p> </div> </li> <li class="list-item"> <div class="list-content"> <h3>box 2</h3> <p>Lorem ipsum dolor</p> </div> </li> <li class="list-item"> <div class="list-content"> <h1>h1</h1> </div> </li></ul>
3 回答

九州編程
TA貢獻1785條經驗 獲得超4個贊
在多行FLEX容器中,每一行的交叉大小是包含在該行上的FLEX項所必需的最小尺寸。

紅顏莎娜
TA貢獻1842條經驗 獲得超13個贊
height: 50%
flex-grow
<RowOne />
<RowTwo />
<div>
flex-column
<div class='flexbox flex-column height-100-percent'> <RowOne class='flex height-50-percent' /> <RowTwo class='flex height-50-percent' /></div>
- 3 回答
- 0 關注
- 670 瀏覽
相關問題推薦
添加回答
舉報
0/150
提交
取消