Javatpoint Logo
Javatpoint Logo

Flexbox flex-wrap

The CSS3 Flexbox flex-wrap property specifies if the flex-items should wrap or not, in the case of not enough space for them on one flex line.

Its possible values are:

  • nowrap: It is the default value. The flexible items will not wrap.
  • wrap: It specifies that the flexible items will wrap if necessary.
  • wrap-reverse: It specifies that the flexible items will wrap, if necessary, in reverse order.

Let's take some example to demonstrate the usage of the above vales.

See this example:

Example1: (Using nowrap value)

This is the by default value.

Test it Now

Example2: (Using wrap value)

Test it Now

Example3: (Using wrap-reverse value)

Test it Now

Youtube For Videos Join Our Youtube Channel: Join Now

Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Trending Technologies

B.Tech / MCA