Search⌘ K
AI Features

Span

Explore how to manage grid layouts in Tailwind CSS by learning to use span classes to control the number of rows and columns an element covers. Understand how to set grid item starts and ends to customize placement. This lesson helps you build precise and efficient page layouts using Tailwind's grid system.

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 and end

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 ...