Columns
Multi-column text and masonry-like layouts
The columns utility creates multi-column layouts where content flows top-to-bottom, then to the next column. Like a newspaper.
Columns
Gap
1
2
3
4
5
6
7
8
Tailwind CSS
<div class="columns-3 gap-4"> <div class="break-inside-avoid mb-2">1</div> <div class="break-inside-avoid mb-2">2</div> <div class="break-inside-avoid mb-2">3</div> <!-- items flow into columns --> </div>