先にまとめ flex-shrink: 0 を Flexbox の子要素に書く親要素は普通に display: flex と overflow: auto ここまでのあらすじ 単純に overflow: auto しとけばスクロールするじゃろ~とやってみたら Flexbox の子要素が軒並みスクロール不要な大きさにまで縮んでしまった。そういえばそうだった。 過去に同じ問題に直面したときはたしか min-width なんか付けたんだけど今回やってるのは大きさがまちまちで決められないし、そもそも min-width もなんか違う感じあるしってんで調べたところ、flex-shrink というプロパティがあることを知った。 flex-shrink 子要素の縮小係数 (shrink factor) を指定します。0 以上の数値。初期値は 1 。 flex-shrink – CSS: カスケーディングス