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-normal | align-items: normal; |
.k-align-items-stretch | 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; |
.k-align-items-self-end | align-items: self-end; |
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.