CSSリファレンス

flex-growの意味と使い方

「flex-grow」はフレックスアイテムの幅の合計がフレックスコンテナのサイズより小さい場合、余白が生じます。flex-growプロパティは、この余白を書くアイテムに分配して幅を広げ、調整するためのプロパティです。割り当てる余白の量を、他のフレックスアイテムに割り当てる量との比率で指定します。負の値は指定できません。

値の指定方法

実数値

割り当てる余白の割合を指定します。この値を省略した場合は「1」とみなされます。負の値は指定できません。


関連プロパティ

  • flex:アイテムの幅の増減を一括して指定する
  • flex-basis:フレックスアイテムの基本の幅を指定する
  • flex-shrink:フレックスコンテナの主軸の幅よりも大きい場合の、フレックスアイテムの縮み率を指定する