Colspan & Rowspan
Write a data cell that spans three columns.
Understand the topic
colspan lets a cell span multiple columns, and rowspan lets it span multiple rows. Count the resulting grid carefully so each row covers the same logical columns. Spanning cells can express real groupings, but complicated merges make tables harder to maintain and navigate. Keep header associations clear and choose simple layouts where possible.
Worked example
<table><caption>Course days</caption>
<tr><th colspan="2" scope="colgroup">Weekend classes</th></tr>
<tr><th scope="col">Saturday</th><th scope="col">Sunday</th></tr>
<tr><td>HTML</td><td>CSS</td></tr>
</table>
The first header spans two columns, matching the two cells in each later row. It names a column group rather than a single data column.
Practice
Write a data cell that spans three columns.
Show a suggested answer
<td colspan="3">No classes on public holidays</td>Common mistake
Do not add extra cells under a rowspan as if the spanning cell occupied no space. Sketch the grid before coding.