Landings

Tailwind CSS

Columns

Utilities for controlling the number of columns within an element.

ClassProperties
columns-1columns: 1;
columns-2columns: 2;
columns-3columns: 3;
columns-4columns: 4;
columns-5columns: 5;
columns-6columns: 6;
columns-7columns: 7;
columns-8columns: 8;
columns-9columns: 9;
columns-10columns: 10;
columns-11columns: 11;
columns-12columns: 12;
columns-autocolumns: auto;
columns-3xscolumns: 16rem; /* 256px */
columns-2xscolumns: 18rem; /* 288px */
columns-xscolumns: 20rem; /* 320px */
columns-smcolumns: 24rem; /* 384px */
columns-mdcolumns: 28rem; /* 448px */
columns-lgcolumns: 32rem; /* 512px */
columns-xlcolumns: 36rem; /* 576px */
columns-2xlcolumns: 42rem; /* 672px */
columns-3xlcolumns: 48rem; /* 768px */
columns-4xlcolumns: 56rem; /* 896px */
columns-5xlcolumns: 64rem; /* 1024px */
columns-6xlcolumns: 72rem; /* 1152px */
columns-7xlcolumns: 80rem; /* 1280px */