すべてのFlexアイテムの位置を変更

すべてのFlexアイテムの主軸と逆方向の位置を変更するには、align-itemsプロパティ(旧仕様ではbox-alignプロパティ)を使用します。

  • ※ Internet Explorerの旧仕様ではflex-alignプロパティをベンダープレフィックス付きで使用します。

【構文】

							align-items:並び;
						

指定可能な値

値(旧仕様) 説明
baseline baseline 要素のテキストのベースラインを基準として並べる
flex-start start 要素全体の先端を基準として並べる
flex-end end 要素全体の終端を基準として並べる
center center 要素全体の中央を基準として並べる
stretch stretch 要素全体を先端・終端を埋める(初期値)

サンプル

要素のテキストのベースラインを基準

item 1

item 2

item 3

item 4

item 5

CSS

要素全体の先端を基準

item 1

item 2

item 3

item 4

item 5

CSS

要素全体の終端を基準

item 1

item 2

item 3

item 4

item 5

CSS

要素全体の中央を基準

item 1

item 2

item 3

item 4

item 5

CSS

要素全体を先端・終端を埋める(初期値)

item 1

item 2

item 3

item 4

item 5

CSS

CSS3逆引きリファレンス一覧へ戻る