<col>: The COL Element
Last updated: 2026-10-13
<col>The COL Element
Defines a table column, usually inside colgroup, to style or span a whole column at once.
| Category | Tables |
|---|---|
| Content Model | Flow content |
| Allowed Parents | Any element that accepts flow content |
| Content Tag | Self-closing — no closing tag needed |
| Status | Standard |
📝 Syntax
<col span="2">⚙️ Attributes
This element supports the global attributes plus the following:
| Attribute | Value | Description |
|---|---|---|
span | Number of columns this definition covers (default 1). |
▶ Example
Edit the code below and see the live result in the playground:
🌐 Browser Support
| Browser |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <col> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Supported in all major browsers | |||||
Tip： col is a void element (no closing tag); column styles like width belong on col rather than td.
❓ FAQ
QHow does col style a whole column?
A
<col> renders nothing itself; its span attribute (default 1) declares which column(s) it represents, always inside a <colgroup>. Styleable properties are limited: width, background, border (with table border-collapse: collapse), and visibility.QWhy can't col change text color?
ABecause
<col> is not the parent of cells — it is an abstract column representative, so inheritable properties (like text color) cannot flow through it to td. Color a column with td:nth-child(n) instead; col handles background, width, and other column-level box styles.QHow does the span attribute of col work?
A
<col span='3'> makes one col element represent three consecutive columns — handy for setting widths quickly: <colgroup><col style='width:40%'><col span='3' style='width:20%'></colgroup>. The covered column count must match the table's real column count.🏷️ Related Tags
💡 Related Cases
More case studies coming soon — check back later.
📚 Related Tutorials
