The rowspan attribute makes a table cell stretch down across multiple rows — used when one value genuinely applies to more than one row.
Syntax
<td rowspan="2">spans two rows</td>Basic Example
<table>
<tr>
<th>Day</th>
<th>Session</th>
</tr>
<tr>
<td rowspan="2">Monday</td>
<td>Morning: HTML</td>
</tr>
<tr>
<td>Evening: CSS</td>
</tr>
</table>Browser output: "Monday" appears once, vertically centered, spanning both the morning and evening rows beside it — instead of being repeated on each row.
How It Works
rowspan="2" tells the browser this cell occupies its column's space across the current row and the next one — meaning the following row needs one fewer cell in that column position, since it's already covered by the spanned cell above.
Important Attributes
| Attribute | Purpose |
|---|---|
rowspan="n" | Number of rows this cell should span, as a plain integer |
Real-World Example
<tr>
<td rowspan="3">Full Stack Batch A</td>
<td>HTML & CSS</td>
</tr>
<tr>
<td>JavaScript</td>
</tr>
<tr>
<td>React</td>
</tr>A batch schedule where the batch name genuinely applies across all three topic rows — avoiding repetitive, cluttered re-typing of "Full Stack Batch A" three separate times.
Comparison: colspan vs rowspan
colspan | rowspan | |
|---|---|---|
| Direction | Stretches sideways, across columns | Stretches downward, across rows |
| Use when... | One label applies across several columns in the same row | One value applies across several rows in the same column |
Common Mistakes
- Forgetting that a spanned cell removes the need for a corresponding cell in the rows below it — leaving that extra cell in creates a misaligned table
- Combining
colspanandrowspanin complex tables without carefully tracking the resulting grid, producing hard-to-debug alignment issues
Best Practices
- Sketch out the intended grid on paper first for any table using multiple spans — it's easy to miscount
- Use
rowspanonly when a value genuinely repeats across consecutive rows in the real data
Accessibility Considerations
Screen readers handle spanned cells correctly when the markup is valid, but as with colspan, keep spanning patterns as simple as the underlying data genuinely requires.
SEO Considerations
No direct ranking effect.
Browser & Modern HTML Notes
Well-supported and unchanged across HTML versions.
Mini Practice
- Build a 3-row schedule table where one cell spans all 3 rows using
rowspan="3". - Combine
colspanandrowspanin one small table (a title row spanning all columns, plus one cell spanning two rows below it).
