Span
Manage rows and columns by using the span class.
We'll cover the following
Manage rows and columns
Sometimes, we want a cell to cover more than one row or column, like CSS tables. Tailwind offers two ways to manage this:
span
start
andend
Span
We use span
to specify the number of columns or rows we want the cell to take up with .col-span-{count}
or .row-span-{count}
, where the suffix is the number of columns or rows. The default value is .col-span-1
or .row-span-1
. The reset helpers are .col-span-auto
and .row-span-auto
.
The flow behavior continues. If we add a span to the first element, our four-cell example is this:
Get hands-on with 1200+ tech skills courses.