flex-grow: Tailwind CSS Flex class

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


Flew Grow

The flex-grow class allows an element to expand and occupy any remaining space within its container.

Example Code

html
<div class="flex p-10 bg-yellow-50 space-x-5">
<div class="flex-grow bg-yellow-400 p-4 text-center text-gray-600 font-bold rounded">flex-grow</div>
<div class="bg-yellow-100 p-4 text-center text-gray-600 font-bold rounded">Fixed Item</div>
<div class="bg-yellow-100 p-4 text-center text-gray-600 font-bold rounded">Fixed Item</div>
</div>

Preview

flex-grow
Fixed Item
Fixed Item

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