References

Beginner-friendly references for web development, with live, editable examples.

The HTML span attribute

Attribute All modern browsers Updated
Quick answer

The HTML span attribute specifies how many columns the element spans, for applying shared styling. It is used on the <col> and <colgroup> elements.

Overview

The span attribute spans a col/colgroup across columns. It is used on table cells (<th>, <td>) and columns.

It defines table structure — spanning cells across rows or columns, and connecting data cells to their headers. These attributes are central to making data tables understandable to screen-reader users.

Syntax

<colgroup><col span="2" style="background:#eef"></colgroup>

Values

Value
A positive integer (default 1).

Best practices

  • Set scope on every <th> so screen readers associate headers with cells.
  • Use colspan/rowspan to merge cells rather than nesting tables.
  • For complex tables, link cells to headers with the headers attribute and matching ids.
  • Add a <caption> so the table has an accessible name.

Frequently asked questions

What does the span attribute do?
Spans a col/colgroup across columns.
How do I merge table cells?
Use colspan to span columns and rowspan to span rows.
How do I make a data table accessible?
Use <th> headers with scope, add a <caption>, and link cells to headers with headers in complex tables.
Which elements use the span attribute?
It is an element-specific attribute, used on table cells (<th>, <td>) and columns.
sizes src