Flex-Grid

Flex Direction

The Telerik and Kendo UI Flex Direction Utilities are CSS utility classes that enable you to control placing direction of the flex items in a flex container.

Utility ClassCSS Property
.k-flex-rowflex-direction: row;
.k-flex-row-reverseflex-direction: row-reverse;
.k-flex-colflex-direction: column;
.k-flex-col-reverseflex-direction: column-reverse;

Row

Use the k-flex-row utility to place the items in the same direction as the main axis.

Row Reverse

Use the k-flex-row-reverse utility to place the items in the opposite direction of the main axis.

Column

Use the k-flex-column utility to place the items in the same direction as the cross axis.

Column Reverse

Use the k-flex-column-reverse utility to place the items in the opposite direction of the cross axis.