如何讓孩子 6 伸展到父母身高的一半？ 避免將6個專案分成2組的方式。我想拉伸 6 歲的孩子但不作業，這對我來說很有意義，因為要拉伸特定的專案會拉伸其余空間，而不是一半。
.parent {
width: 600px;
margin: 0 auto;
padding: 10px;
height: 300px;
background-color: #eee;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
align-content: space-between;
}
.parent div {
color: #eee;
background-color: rgb(29, 28, 27);
padding: 10px 0;
width: calc(94%/3);
display: flex;
justify-content: center;
}
.parent div.ch6 {
align-self: stretch;
}<div class="parent">
<div class="ch1">1</div>
<div class="ch2">2</div>
<div class="ch3">3</div>
<div class="ch4">4</div>
<div class="ch5">5</div>
<div class="ch6">6</div>
</div>uj5u.com熱心網友回復：
如下所示：
.parent {
width: 600px;
margin: 0 auto;
padding: 10px;
height: 300px;
background-color: #eee;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
/*align-content: space-between; removed */
}
.parent div {
color: #eee;
background-color: rgb(29, 28, 27);
padding: 10px 0;
width: calc(94%/3);
display: flex;
justify-content: center;
}
.parent div.ch6 {
align-self: stretch;
}
.parent div.ch5,
.parent div.ch4{
align-self: end; /* added */
}<div class="parent">
<div class="ch1">1</div>
<div class="ch2">2</div>
<div class="ch3">3</div>
<div class="ch4">4</div>
<div class="ch5">5</div>
<div class="ch6">6</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/479690.html