References

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

The HTML <col> 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 the <col> and <colgroup> elements.

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 the <col> and <colgroup> elements.
sizes src