CSS တွင် Flex အစုများ၏ Inline-Block မိဘ

မိဘ element ၏ display property အတွက် flex တန်ဖိုးအစား၊ inline-flex တန်ဖိုးကို သတ်မှတ်ပေးနိုင်ပါသည်။ ဤသို့ပြုလုပ်ပါက ထိုမိဘ element သည် inline-block element တစ်ခုကဲ့သို့ ပြုမူပါလိမ့်မည်။

ဥပမာအားဖြင့်၊ မိဘ element ၏ width ကို မသတ်မှတ်ပါက၊ ၎င်း၏ width သည် ၎င်း၏ သားသမီး element များ၏ width ပေါ်တွင် ဖွဲ့စည်းသွားပါမည်။

html<div class="parent">
  <div class="child">1</div>
  <div class="child">2</div>
  <div class="child">3</div>
</div>

css.parent {
  display: inline-flex;
  border: 1px solid red;
}
.child {
  width: 50px;
  height: 50px;
  border: 1px solid green;
}

Результат: