在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 回答
嗶嗶one
TA貢獻(xiàn)1854條經(jīng)驗 獲得超8個贊
在多行FLEX容器中，每一行的交叉大小是包含在該行上的FLEX項所必需的最小尺寸。
慕姐8265434
TA貢獻(xiàn)1813條經(jīng)驗 獲得超2個贊
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>
添加回答
舉報
0/150
提交
取消