when flex container have flex items.items shrinks even if width is declared.but if i make this flex items a flex container then flex-items with fix width of this inner container do not shrink.the problem is being solved if i add min-width:0 to inner container. i will be very kind if someone help me to understand the behavior.thanks.
.flex-container {
border: 2px solid red;
height: 200px;
padding: 10px;
display: flex;
}
.flex-item1 {
border: 2px solid black;
padding: 10px;
display: flex;
}
.flex-item2 {
border: 2px solid black;
padding: 10px;
display: flex;
}
.nested-flex-item1 {
border: 2px solid blue;
width: 200px;
}
<div class="flex-container">
<div class="flex-item1">
<div class="nested-flex-item1">
</div>
<div class="nested-flex-item2">
</div>
</div>
<div class="flex-item2">
<div class="nested-flex-item1">
</div>
</div>
</div>