Align Items
The Telerik and Kendo UI Align Items Utilities are CSS utility classes that enable you to control how grid and flex items will be aligned to each other along the cross axis.
| Utility Class | CSS Property |
|---|---|
.k-align-items-self-end | align-items: self-end; |
.k-align-items-normal | align-items: normal; |
.k-align-items-stretch | align-items: stretch; |
.k-align-items-center | align-items: center; |
.k-align-items-start | align-items: start; |
.k-align-items-end | align-items: end; |
.k-align-items-flex-start | align-items: flex-start; |
.k-align-items-flex-end | align-items: flex-end; |
.k-align-items-baseline | align-items: baseline; |
.k-align-items-first-baseline | align-items: first baseline; |
.k-align-items-last-baseline | align-items: last baseline; |
.k-align-items-self-start | align-items: self-start; |
Stretch
Use the k-align-items-stretch utility to stretch the items in a row equally along the cross axis.
Center
Use the k-align-items-center utility to center the items in a row of the container along the cross axis.
Start
Use the k-align-items-start utility to align the items in a row to the start of the container along the cross axis.
End
Use the k-align-items-end utility to align the items in a row to the end of the container along the cross axis.
Baseline
Use the k-align-items-baseline utility to align the items in a row to the baseline of the container along the cross axis.
