備忘録的プログラミングリファレンス

justify-contentプロパティ

 justify-contentプロパティは、display:flex;によるエレメント(フレックスコンテナ)のおいて子エレメント(フレックスアイテム)の主軸方向の並びを指定するプロパティです。主軸方向はデフォルトで列(横)方向です。

フレックスアイテムを中央に表示
justify-content: center;

 垂直方向の並びは、align-itemsプロパティで指定します。

構文(Syntax)

CSS

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

DOM(JavaScript)

値の取得
String = object.style.justifyContent;
値の設定
object.style.justifyContent="flex-start | flex-end | center | space-between | space-around | initial | inherit";

Values

Value摘要
flex-start初期値(default値)、頭寄せ、デフォルトでは左寄せ
flex-end末寄せ、デフォルトでは右寄せ
center中央寄せ
space-between幅に対して均等に配置
space-around両端にスペースを設けて均等の配置
initial初期値に戻す
inherit親エレメントのプロパティを継承

備考(Remarks)

初期値(Default value)flex-start
継承(Inherited)No
CSS AnimationNo