tailwindcss/docs/source/styles/flexbox/wrapping.blade.md

extends	title	category
_layouts.markdown	Wrapping - Flexbox	Flexbox

Flex Wrapping

Usage Responsive Customizing

Tailwind provides a comprehensive set of Flexbox utilities out of the box to make it easy for you to implement complex layouts without having to write any new CSS.

Don't wrap Default

Use .flex-no-wrap to prevent flex items from wrapping, causing inflexible items to overflow the container if necessary:

@component('_partials.code-sample')

1

2

3

@endcomponent

Wrap normally

Use .flex-wrap to allow flex items to wrap:

@component('_partials.code-sample')

1

2

3

@endcomponent

Wrap reversed

Use .flex-wrap-reverse to wrap flex items in the reverse direction:

@component('_partials.code-sample')

1

2

3

@endcomponent