flex-shrink: Tailwind CSS Flex class

The my-2 class adds a margin of 0.5rem (8px) to the top and bottom sides of an element.


Flex Shrink

The flex-shrink class allows an element to shrink when the container has insufficient space.

Example Code

html
<div class="flex items-center justify-center space-x-5 p-5">
<div class="bg-blue-200 text-white font-bold p-4 rounded">Flex-none</div>
<div class="flex-shrink bg-blue-500 p-4 text-white font-bold rounded">flex-shrink</div>
<div class="bg-blue-200 text-white font-bold p-4 rounded">Flex-none</div>
</div>

Preview

Flex-none
flex-shrink
Flex-none

Windframe is a drag and drop builder for rapidly building tailwind css websites and UIs

Start building stunning tailwind UIs! 

Build from scratch or select prebuilt tailwind templates