--- extends: _layouts.markdown title: "Grid" --- # Grid Basic grid example:

.md:w-1/3

Columns don't need to fill a row:

.md:w-1/4

Columns can be different widths:

.md:w-1/4

.md:w-1/2

.md:w-1/4

Rows can overflow and wrap:

.md:w-1/3

Column widths can be automatic:

.md:flex-fill

Fixed width columns are still respected even if a smaller screen has auto column widths:

.flex-fill.md:w-1/6.md:flex-none

Use margin auto utilities to accomplish offsets:

.md:w-1/3.md:ml-auto

.md:w-1/6.md:mr-auto