align-content
align-content プロパティは、フレックスボックスの交差軸またはグリッドのブロック軸方向の揃え位置を指定します。複数行のコンテナのみ有効となるため、flex-wrap: nowrap; が指定されている単一行のフレックスコンテナには効果がないことに注意が必要です。
プロパティの詳細
- 値
- flex-start, flex-end, center, space-between, space-around, stretch
- 初期値
- stretch
- 対象
- マルチラインフレックスコンテナ
- 継承
- しない
- CSS レベル
- CSS 3
値
- flex-start
- 開始位置揃え。各行の合計の高さよりコンテナが大きければコンテナの下部に隙間ができます。
- flex-end
- 終了位置揃え。各行の合計の高さよりコンテナが大きければコンテナの上部に隙間ができます。
- center
- 中央揃え。各行の合計の高さよりコンテナが大きければコンテナの上下に隙間を取りセンタリングされます。
- space-between
- 最初の行は開始位置、最後の行は終了位置に配置され、その間の行は均等に配置されます。
- space-around
- 各行が均等に配置されますが、最初の行の上のスペース、最後の行の下のスペースは行と行の間のスペースの半分の幅で設定されます。
- stretch
- 行間のスペースが詰められ、コンテナ内に隙間なく配置されます。
