Grid Axis

CSS grid layout is a two-dimensional layout method enabling the laying out of content in rows and columns. Therefore in any grid we have two axes. The block or column axis, and the inline or row axis.

It is along these axes that items can be aligned and justified using the properties defined in the Box Alignment specification.

The inline axis (also called row axis, or main axis) is the direction along which regular text flows. The block axis (also called column axis, or cross axis) is the axis used when laying out blocks of text. The physical direction of these axes can change according to the writing mode of the document.