Тамаъкории блокҳои flex бо дарозии мушаххас дар CSS
Бигзор мо чанд блоки флекс дошта бошем.
Ба як аз ин блокҳо flex-grow
ба қимати 1 гузорем, ва ба ҳамаи унсурҳои дигар
- ягон дарозиро. Дар натиҷа бармеояд,
ки ҳамаи блокҳо дарозии собит доранд,
ва блоки тамаъкори моҳи мо тамоми
фазои дастраси боқимондаро ишғол мекунад:
<div class="parent">
<div class="child elem1"></div>
<div class="child elem2"></div>
<div class="child elem3"></div>
</div>
.parent {
display: flex;
width: 400px;
height: 200px;
border: 1px solid red;
}
.child {
height: 50px;
border: 1px solid green;
}
.elem1 {
width: 100px;
}
.elem2 {
flex-grow: 1;
}
.elem3 {
width: 100px;
}
:
Таъсири хосусан назаррас аст, вақте ки дарозии волидайн бо фоиз ифода шудааст. Дар ин ҳолат ҳангоми тағйир ёфтани дарозии волидайн, блоки тамаъкори мо дарозии ҳалёбӣ (шиновар) дорад, ва ҳамаи дигарон - дарозии собит: