新着！ 私の44ページ電子書籍「44分でCSS」が発売されました！ 😃

今すぐ入手 →

#justify-content

flexbox/gridコンテナ内で、メイン軸に沿ってflexbox/gridアイテムをどのように配置するかを定義します。

デフォルト justify-content: flex-start;

flexbox/gridアイテムは、コンテナのメイン軸の開始に向かって寄せられます。

justify-content: flex-end;

flexbox/gridアイテムは、コンテナのメイン軸の終了に向かって寄せられます。

justify-content: center;

flexbox/gridアイテムは、コンテナのメイン軸に沿って中央に配置されます。

justify-content: space-between;

残りのスペースは、flexbox/gridアイテムの間に分配されます。

justify-content: space-around;

残りのスペースは、flexbox/gridアイテムの周囲に分配されます。これにより、最初のアイテムの前と最後のアイテムの後にスペースが追加されます。