■レイアウト:Flex d-flex:ユーティリティ:flex文字の伸縮 flex-shrink 余白で縮小される(他を優先)

flex文字01(flex-shrink-1)
flex文字02
flex文字03
  <div class="d-flex" style="height: 100px">
    <div class="p-2 flex-shrink-1">flex文字01(flex-shrink-1)</div>
    <div class="p-2 w-100">flex文字02</div>
    <div class="p-2 w-100">flex文字03</div>
  </div>