flex-shrink

flex-shrink はフレックスアイテムの縮む倍率を指定します。ただし、親要素であるフレックスコンテナ内の空間の全てがフレックスアイテムに占められていて余白がない場合のみ機能します。

<div class="container">
  <div class="box1">A</div>
  <div class="box2">B</div>
  <div class="box3">C</div>
</div>

.container {
  display: flex;
  width: 300px;
  border: solid 1px black;
}