Height
The Telerik and Kendo UI Height Utilities are CSS utility classes that enable you to control the height of an element.
| Utility Class | CSS Property |
|---|---|
.k-max-h-fit | max-height: fit-content; |
.k-h-0 | height: 0; |
.k-h-1px | height: 1px; |
.k-h-1 | height: 0.25rem; |
.k-h-full | height: 100%; |
.k-h-screen | height: 100vh; |
.k-h-min | height: min-content; |
.k-h-max | height: max-content; |
.k-h-fit | height: fit-content; |
.k-min-h-0 | min-height: 0; |
.k-min-h-1px | min-height: 1px; |
.k-min-h-1 | min-height: 0.25rem; |
.k-min-h-full | min-height: 100%; |
.k-min-h-screen | min-height: 100vh; |
.k-min-h-min | min-height: min-content; |
.k-min-h-max | min-height: max-content; |
.k-min-h-fit | min-height: fit-content; |
.k-max-h-0 | max-height: 0; |
.k-max-h-1px | max-height: 1px; |
.k-max-h-1 | max-height: 0.25rem; |
.k-max-h-full | max-height: 100%; |
.k-max-h-screen | max-height: 100vh; |
.k-max-h-min | max-height: min-content; |
.k-max-h-max | max-height: max-content; |
Fixed
Use the k-h-{value} utility to set a fixed height to an element.
Full
Use the k-h-full utility to make the element expand to 100% of its parent's height.
Screen
Use the k-h-screen utility to make the element expand to 100% of the viewport height.
Minimum
Use the k-h-min-{height} utility to set a minimum height to an element.
Maximum
Use the k-h-max-{height} utility to set a maximum height to an element.
