Justify Content

The Telerik and Kendo UI Flex-Grid Utilities enable you to control the position, alignment, and size of the grid and the flex items.

Justify Content

The Telerik and Kendo UI Justify Content Utilities are CSS utility classes that enable you to control how the element's children are aligned along the main axis.

Utility ClassCSS Property
.k-justify-content-evenlyjustify-content: space-evenly;
.k-justify-content-normaljustify-content: normal;
.k-justify-content-stretchjustify-content: stretch;
.k-justify-content-centerjustify-content: center;
.k-justify-content-startjustify-content: start;
.k-justify-content-endjustify-content: end;
.k-justify-content-selft-startjustify-content: flex-start;
.k-justify-content-self-endjustify-content: flex-end;
.k-justify-content-baselinejustify-content: baseline;
.k-justify-content-first-baselinejustify-content: first baseline;
.k-justify-content-last-baselinejustify-content: last baseline;
.k-justify-content-betweenjustify-content: space-between;
.k-justify-content-aroundjustify-content: space-around;

Stretch

Use the k-justify-content-stretch utility to stretch the items equally within the entire container along the main axis.

Center

Use the k-justify-content-center utility to align the items in the center of the container along the main axis.

Start

Use the k-justify-content-start utility to align the items in the center of the container along the main axis.

End

Use the k-justify-content-end utility to align the items in the center of the container along the main axis.

Normal

Use the k-justify-content-normal utility to align the items at their default positions when no justify-content value is set.

Space Between

Use the k-justify-content-between utility to distribute the items with an equal space between them within the container along the main axis.

Space Around

Use the k-justify-content-around utility to distribute the items with an equal space around them within the container along the main axis.

Space Evenly

Use the k-justify-content-evenly utility to distribute items with an equal space between them within the container along the main axis. The same space appears before the first and after the last item.

Feedback