A flex elemek inline-block szülője a CSS-ben

A display tulajdonságnál a flex érték helyett a szülőnek beállítható a inline-flex érték is. Ebben az esetben ez a szülő úgy fog viselkedni, mint egy inline-block elem.

Például, ha nem adjuk meg a szülő szélességét, akkor a szélessége az utódok szélességével alakul ki:

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;
}

Результат: