flex-nowrap: Tailwind CSS Flex class

The flex-nowrap class prevents flex items from wrapping, keeping them on a single line.

flex-nowrap

The flex-nowrap class prevents flex items from wrapping, keeping them on a single line.

Example Code

html
<div class="flex flex-nowrap items-center justify-center p-5 text-white font-bold">
  <div class="bg-green-500 p-4 m-2 rounded">flex-nonwrap</div>
  <div class="bg-green-500 p-4 m-2 rounded">flex-nonwrap</div>
  <div class="bg-green-500 p-4 m-2 rounded">flex-nonwrap</div>
</div>

Preview

flex-nonwrap
flex-nonwrap
flex-nonwrap

Windframe is an AI visual editor for rapidly building stunning web UIs & websites

Start building stunning web UIs & websites!

Build from scratch or select prebuilt tailwind templates
Learn more about Windframe