{ align-content 【 アライン・コンテント 】 : 位置; }

align-contentプロパティは、複数行になったフレックスコンテナに内包されるフレックスアイテムのクロス軸方向の揃え位置を指定します。

初期値	stretch
継承	なし
適用される要素	複数行のフレックスコンテナ
モジュール	CSS Flexible Box Layout Module Level 1

値の指定方法

位置

flex-start	フレックスコンテナのクロス軸の起点に、行間の余白が生じないように配置されます。通常、上端に配置されます。
flex-end	フレックスコンテナのクロス軸の終点に、行間の余白が生じないように配置されます。通常、下端に配置されます。
center	フレックスコンテナのクロス軸の中央に、行間の余白が生じないように配置されます。通常、上下中央に配置されます。
space-between	フレックスコンテナのクロス軸の幅（高さ）に対して余白をもって等間隔に配置されます。最初の行は起点、最後の行は終点に揃えられ、間の行は等間隔に配置されます。余白がないときは、flex-startと同様になります。
space-around	フレックスコンテナのクロス軸の幅に対して余白をもって等間隔に配置されます。最初の行と起点、最後の行と終点との間にも余白が生じます。余白がないときは、centerと同様になります。
stretch	フレックスコンテナのクロス軸の幅に対して均等の幅に伸縮されます。

サンプルコード

.container {
  display: flex;
  align-content: space-around;
}