Web4College

CSS flex-wrap property

src

Description

CSS flex-wrap determines whether the content flows across one line or multiple lines and direction of cross-axis. The cross-axis determines the direction in which new lines are stacked in.

Syntax

flex-wrap : nowrap | wrap | wrap-reverse

Property values

nowrapDefault

The content flows across one line within flex-container.

flex-wrap: nowrap;
Try it

wrap

The content flows across multiple lines within flex-container.

flex-wrap: wrap;
Try it

wrap-reverse

The content flows across multiple lines and the lines are stacked in reverse order i.e. the cross-axis is reversed.

flex-wrap: wrap-reverse;
Try it

Applicable to

It applies to flex containers.