Flexbox & Grid

Grid Template Columns

Utilities for specifying the columns in a grid layout.

Basic usage

Specifying the columns in a grid

Use the grid-cols-{n} utilities to create grids with n equally sized columns.

01
02
03
04
05
06
07
08
09
<div className="grid **grid-cols-4** gap-4">
  <div>01</div>
  <!-- ... -->
  <div>09</div>
</div>