---
title: Justify Items
position: 19
seo_title: Telerik and Kendo UI Justify Items Utilities
seo_description: Use the Telerik and Kendo UI Justify Items Utilities to control
  how grid and flex items will be aligned to each other along the main axis.
---
## Justify Items

The Use the Telerik and Kendo UI Justify Items Utilities are CSS utility classes that enable you to control how the grid and flex items will be aligned in respect to each other along the main axis.

<CSSRulesList data='{"id":"justify-items"}'></CSSRulesList>

### Stretch

Use the `k-align-items-stretch` utility to stretch the items in a column equally along the main axis.

<LiveDemo data='{"links":[],"demo":"utils/flex-grid/justify-items/stretch","height":200,"codePreviewSettings":{"filterSelector":"","ignoreClassNames":"k-p-5 k-bg-primary k-rounded-lg"}}'></LiveDemo>

### Center

Use the `k-align-items-center` utility to center items in a column of the container along the main axis.

<LiveDemo data='{"links":[],"demo":"utils/flex-grid/justify-items/center","height":200,"codePreviewSettings":{"filterSelector":"","ignoreClassNames":"k-p-5 k-w-10 k-bg-primary k-rounded-lg"}}'></LiveDemo>

### Start

Use the `k-align-items-start` utility to align items in a column to the start of the container along the main axis.

<LiveDemo data='{"links":[],"demo":"utils/flex-grid/justify-items/start","height":200,"codePreviewSettings":{"filterSelector":"","ignoreClassNames":"k-p-5 k-w-10 k-bg-primary k-rounded-lg"}}'></LiveDemo>

### End

Use the `k-align-items-end` utility to align items in a column to the end of the container along the main axis.

<LiveDemo data='{"links":[],"demo":"utils/flex-grid/justify-items/end","height":200,"codePreviewSettings":{"filterSelector":"","ignoreClassNames":"k-p-5 k-w-10 k-bg-primary k-rounded-lg"}}'></LiveDemo>