align-items-baseline

bootstrap5.css

.align-items-baseline {
  -ms-flex-align: baseline !important;
  align-items: baseline !important;
}

html bootstrap5 Sample

flexコンテナー内のアイテムの配置/ベースライン：align-items-baseline

flex文字01
（padding: 2rem）

flex文字02
（padding: 4rem）

flex文字03
（padding: 1rem）

  <div class="d-flex align-items-baseline" style="height: 200px">
    <!-- paddingも含めて、flaxの大きさが決まる 文字の位置の高さが同じ-->
    <div style="padding: 2rem">flex文字01 <br>（padding: 2rem）</div>
    <div style="padding: 4rem">flex文字02 <br>（padding: 4rem）</div>
    <div style="padding: 1rem">flex文字03 <br>（padding: 1rem）</div>
  </div>