CSS3

プロパティ

align-content

→●、mdn

一連の flex 行の収納法。

align-content プロパティは、交叉軸に余った空間があるときに、flex コンテナの一連の行°を flex コンテナの中で整列する ─ justify-content が個々のアイテムを主軸の中で整列するときと同様に。このプロパティは、単行°な flex コンテナに対しては 効果はないことに注意。

flex-start

一連の行°は、flex コンテナの始端に寄せるように収納される： flex コンテナの中の最初の行°の交叉始端辺は、flex コンテナの交叉始端辺に接合され、後続の各行°は、先行する行°に接合される。

flex-end

一連の行°は、flex コンテナの終端に寄せるように収納される： flex コンテナの中の最後の行°の交叉終端辺は、flex コンテナの交叉終端辺に接合され、後続の各行°は、先行する行°に接合される。

center

一連の行°は、flex コンテナの中央に寄せるように収納される： flex コンテナの中の一連の行°は、互いに接合された上で、flex コンテナの中央に整列される ─［ flex コンテナの交叉始端内容辺と flex コンテナの最初の行°との合間、］、および［ flex コンテナの交叉終端内容辺と flex コンテナの最後の行°との合間］の空間が等量になるように（残された free 空間が負である場合、一連の行°は両方向に等しく過フローすることになる）。

space-between

一連の行°は、flex コンテナの中で均等に分布される： 残された free 空間が負である場合、または flex コンテナ内の flex 行が 1 本だけの場合、この値の効果は、flex-start と一致する。他の場合、flex コンテナの中の［最初／最後］の行°の［ 交叉始端／交叉終端］辺が、flex コンテナの［交叉始端／交叉終端 ］内容辺に接合され、flex コンテナの中の残りの行°については、隣接する どの 2 本の行°の間隔も同じになるように、free 空間が配分される。

space-around

一連の flex アイテムは、両端には半分サイズの空間を伴う様に、flex コンテナの中で均等に分布される： 残された free 空間が負である場合、この値の効果は center と一致する。他の場合、flex コンテナの中の一連の行°は［隣接する どの 2 本の行°の間隔も同じサイズになり、その半分サイズが［［最初／最後］の行°と［ flex コンテナ辺］との間隔］になるように、free 空間が配分される。

stretch

一連の行°は、残りの空間を占めるように伸張される： 残された free 空間が負である場合、この値の効果は flex-start に一致する。他の場合、free 空間は、すべての行°の合間が等しくになるように分割された上で それらの交叉サイズを増大させる。

¶図省く

テスト