Flexアイテムの位置を個別に変更

Flexアイテムの主軸と逆方向の位置を個別に変更するには、align-selfプロパティを使用します。
flex-directionプロパティがrowまたはrow-reverseの場合は縦軸、columnまたはcolumn-reverseの場合は横軸の位置を調整します。

【構文】

							align-self:位置;
						

指定可能な値

説明 初期値
auto 自動計算(flex-startと同じ?)
flex-start Flexを開始している位置 -
flex-end Flexを終了している位置 -
center 中央 -
baseline テキストのベースラインの基準位置 -
stretch 要素全体
(横並びの場合は上辺から下辺まで、縦並びの場合は左辺から右辺まで)
-

サンプル

auto

flex-start

flex-end

center

baseline

stretch

CSS

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