Cross Axis (交差軸)

フレックスボックス における交差軸 (cross axis / クロス軸) は、主軸 (main axis / メイン軸) と交差する軸で、flex-direction が row または row-reverse であるとき (つまり主軸が横方向であるとき)、縦方向の軸のことです。

主軸が column または column-reverse の場合は、交差軸は横方向となります。

交差軸方向のアイテムの位置合わせは、フレックスコンテナーの align-items プロパティかアイテムの align-self プロパティによって行われます。交差軸方向に余白がある複数行のフレックスコンテナーでは、align-content を使って行間を制御することができます。

• CSS フレックスボックスガイド: フレックスボックスの基本概念
• CSS フレックスボックスガイド: フレックスコンテナー内のアイテムの配置
• CSS フレックスボックスガイド: フレックスアイテムの折り返しのマスター