align-content プロパティ

　align-content プロパティは、エレメントのレイアウトのための display:flex; において、主軸方向に対してクロス方向の子エレメントの配置を指定するプロパティです。
　主軸方向をフレックスラインといいます。

　align-content プロパティは、表示しきれない場合の折返しの指定である flex-wrap プロパティと併せて使用します。

フレックスアイテムを垂直方向の中心に

display: flex;
flex-wrap: wrap;
align-content: center;

　display:flex; のデフォルトでは、横方向が主軸方向（フレックスライン）です。垂直方向（クロス方向）が縦方向になります。 flex-direction によってフレックスラインの方向を変更することができます。

　align-itemsプロパティと似ていますが、align-itemsプロパティはフレックスアイテムを整列するプロパティです。

　以下のような関連するプロパティがあります。


display:flex;	複数のエレメントを緩やかに配列
align-items	初期の配置位置
align-self	フレックスアイテムの配置位置
justify-content	主軸方向での配置を指定
flex-wrap	横並びにしたフレックスアイテムの折り返し
flex-basis	フレックスアイテムの基本となる幅
flex-direction	フレックスアイテムの縦または横の並び
flex-flow	flex-direction、flex-wrapを一括指定

構文(Syntax)

align-content: stretch | center | flex-start | flex-end | space-between | space-around | initial | inherit ;

値の取得

object.style.alignContent;

値の設定

object.style.alignContent=" stretch | center | flex-start | flex-end | space-between | space-around | initial | inherit ";