Display, positioning and visibility classes in the v1 stylesheet. The frozen v1.0.0 stylesheet contains 35 classes in this family.
Classes#
| Class | Notes |
|---|---|
block | — |
inline-block | — |
inline | — |
flex | — |
inline-flex | — |
grid | — |
inline-grid | — |
hidden | — |
flex-row | — |
flex-row-reverse | — |
flex-col | — |
flex-col-reverse | — |
flex-wrap | — |
flex-wrap-reverse | — |
flex-nowrap | — |
grid-cols-1 | Column templates 1–12 |
grid-cols-2 | Column templates 1–12 |
grid-cols-3 | Column templates 1–12 |
grid-cols-4 | Column templates 1–12 |
grid-cols-5 | Column templates 1–12 |
grid-cols-6 | Column templates 1–12 |
grid-cols-7 | Column templates 1–12 |
grid-cols-8 | Column templates 1–12 |
grid-cols-9 | Column templates 1–12 |
grid-cols-10 | Column templates 1–12 |
grid-cols-11 | Column templates 1–12 |
grid-cols-12 | Column templates 1–12 |
static | — |
fixed | — |
absolute | — |
relative | — |
sticky | — |
grid-dashboard | — |
grid-holy-grail | — |
grid-masonry | — |
Usage#
index.html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/nakshora/nakshora@main/minified-version/v1.0.0.css" />
<div class="block">…</div>Scaling beyond v1#
v1 utilities are frozen — no JIT, no arbitrary values. When you outgrow them, the releases/migration-v1-to-v3|migration guide moves you to the modern engine where this family gains responsive variants, state variants and 11,417 utilities.