Skip to content

Column Spanning

A cell is merged with the previous cell in the same row by leaving the cell completely empty (no spaces — just consecutive pipe characters ||).

Each additional | adds one more column to the span:

Syntax Result
cell || colspan="2"
cell ||| colspan="3"

Colspan in the header

|            | Grouping  ||
| Header     | A         | B         |
| ---------- | :-------: | --------: |
| Data       | 1         | 2         |
Grouping
Header A B
Data 1 2 
<table>
<thead>
<tr>
<th></th>
<th colspan="2" style="text-align:center">Grouping</th>
</tr>
<tr>
<th>Header</th>
<th style="text-align:center">A</th>
<th style="text-align:right">B</th>
</tr>
</thead>
<tbody>
<tr>
<td>Data</td>
<td style="text-align:center">1</td>
<td style="text-align:right">2</td>
</tr>
</tbody>
</table>

Colspan in the body

| A | B | C |
| - | - | - |
| spans   |||
| 1 | 2 | 3 |
A B C
spans
1 2 3 
<table>
<thead>
<tr>
<th>A</th>
<th>B</th>
<th>C</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="3">spans</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
</tbody>
</table>

Colspan combined with alignment

The alignment of the leftmost spanned column is applied to the merged cell.

|              | Grouping      ||
| Header       | A             | B             |
| :----------- | :-----------: | ------------: |
| Row 1        | spans (centre)||
| Row 2        | centre        | right         |
Grouping
Header A B
Row 1 spans (centre)
Row 2 centre right 
<table>
<thead>
<tr>
<th style="text-align:left"></th>
<th colspan="2" style="text-align:center">Grouping</th>
</tr>
<tr>
<th style="text-align:left">Header</th>
<th style="text-align:center">A</th>
<th style="text-align:right">B</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:left">Row 1</td>
<td colspan="2" style="text-align:center">spans (centre)</td>
</tr>
<tr>
<td style="text-align:left">Row 2</td>
<td style="text-align:center">centre</td>
<td style="text-align:right">right</td>
</tr>
</tbody>
</table>

Empty vs. whitespace

Only a strictly empty cell slice (no characters at all) triggers colspan. A cell containing only spaces is a regular empty-content cell.

| A  | B  |
| -  | -  |
| 1  |    |
A B
1 
<table>
<thead>
<tr>
<th>A</th>
<th>B</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td></td>
</tr>
</tbody>
</table>