Which property helps align grid items along the cross axis within a grid container?

Prepare for the CSS Mastery Recipient Portal Test. Study with comprehensive questions and in-depth explanations. Enhance your CSS skills and ace your test!

Multiple Choice

Which property helps align grid items along the cross axis within a grid container?

Explanation:
In CSS Grid, the cross axis refers to the direction perpendicular to the inline (horizontal) axis. To control how grid items sit within their grid areas along that cross axis, you use align-items. It determines how each item is positioned vertically inside its grid cell—values like stretch, start, center, or end let you place items as needed. For example, align-items: center centers items within their grid areas along the cross axis. By contrast, justify-content moves the whole grid along the inline axis, while grid-auto-rows and grid-template-columns define row heights and column sizes, not per-item cross-axis alignment.

In CSS Grid, the cross axis refers to the direction perpendicular to the inline (horizontal) axis. To control how grid items sit within their grid areas along that cross axis, you use align-items. It determines how each item is positioned vertically inside its grid cell—values like stretch, start, center, or end let you place items as needed. For example, align-items: center centers items within their grid areas along the cross axis. By contrast, justify-content moves the whole grid along the inline axis, while grid-auto-rows and grid-template-columns define row heights and column sizes, not per-item cross-axis alignment.

Subscribe

Get the latest from Examzify

You can unsubscribe at any time. Read our privacy policy