Cet utilitaire divise le contenu en plusieurs colonnes, permettant de créer facilement des mises en page multi-colonnes pour le texte ou les éléments.
| Classe |
Styles |
| columns-<nombre> |
columns: <nombre>; |
| columns-3xs |
columns: var(--container-3xs); /* 16rem (256px) */ |
| columns-2xs |
columns: var(--container-2xs); /* 18rem (288px) */ |
| columns-xs |
columns: var(--container-xs); /* 20rem (320px) */ |
| columns-sm |
columns: var(--container-sm); /* 24rem (384px) */ |
| columns-md |
columns: var(--container-md); /* 28rem (448px) */ |
| columns-lg |
columns: var(--container-lg); /* 32rem (512px) */ |
| columns-xl |
columns: var(--container-xl); /* 36rem (576px) */ |
| columns-2xl |
columns: var(--container-2xl); /* 42rem (672px) */ |
| columns-3xl |
columns: var(--container-3xl); /* 48rem (768px) */ |
| columns-4xl |
columns: var(--container-4xl); /* 56rem (896px) */ |
| columns-5xl |
columns: var(--container-5xl); /* 64rem (1024px) */ |
| columns-6xl |
columns: var(--container-6xl); /* 72rem (1152px) */ |
| columns-7xl |
columns: var(--container-7xl); /* 80rem (1280px) */ |
| columns-auto |
columns: auto; |
| columns-(<propriete-personnalisee>) |
columns: var(<propriete-personnalisee>); |
| columns-[<valeur>] |
columns: <valeur>; |
