---
title: Flex Wrap
position: 3
seo_title: Telerik and Kendo UI Flex Wrap Utilities
seo_description: Use the Telerik and Kendo UI Flex Wrap Utilities to
  control how the flex item will wrap.
---
## Flex Wrap

The Telerik and Kendo UI Flex Wrap Utilities are CSS utility classes that enable you to control how the flex item will wrap.

<CSSRulesList data='{"id":"flex-wrap"}'></CSSRulesList>

### Wrap

Use the `k-flex-wrap` utility to enable a flex item to wrap into multiple lines.

<LiveDemo data='{"links":[],"demo":"utils/flex-grid/flex-wrap/wrap","height":200,"codePreviewSettings":{"filterSelector":"","ignoreClassNames":" k-p-4 k-rounded-lg"}}'></LiveDemo>

### Wrap Reverse

Use the `k-flex-wrap-reverse` utility to enable a flex item to wrap into multiple lines in reverse order.

<LiveDemo data='{"links":[],"demo":"utils/flex-grid/flex-wrap/wrap-reverse","height":200,"codePreviewSettings":{"filterSelector":"","ignoreClassNames":" k-p-4 k-rounded-lg"}}'></LiveDemo>

### No Wrap

Use the `k-flex-nowrap` utility to prevent a flex item from wrapping into multiple lines.

<LiveDemo data='{"links":[],"demo":"utils/flex-grid/flex-wrap/nowrap","height":200,"codePreviewSettings":{"filterSelector":"","ignoreClassNames":" k-p-4 k-rounded-lg"}}'></LiveDemo>