HTML rowspan Attribute
Description
The rowspan
attribute in HTML is used to merge multiple rows in a table vertically. It allows a single table cell (<td>
or <th>
) to span across more than one row, effectively combining or merging several rows into one cell vertically. This attribute is particularly useful for organizing table data in a way that is visually coherent and aligned with the logical structure of the information being presented.
To use the rowspan
attribute, it is added to a <td>
or <th>
element within a table, with its value indicating the number of rows the cell should span across. For example, rowspan="2"
would mean that the cell extends over two rows. The cells that would normally appear in the spanned rows and the same column are omitted, as the spanned cell occupies their space. This technique is often employed in tables to group related information under a single heading or to simplify the table structure for better readability.
Syntax
<tagname rowspan="number">
Values
- numberNumber of rows a table cell will span.
Applies To
The rowspan
attribute can be used on the following html elements.
Example
<table border="1">
<tr>
<th>Product</th>
<th rowspan="2">Category</th> <th>Price</th>
</tr>
<tr>
<td>T-Shirt</td>
<td>Clothing</td>
</tr>
<tr>
<td>Coffee Mug</td>
<td>Drinkware</td>
<td>$5.99</td>
</tr>
</table>
Browser Support
The following table will show you the current browser support for the HTML rowspan
Attribute.
Desktop | |||||
![]() |
![]() |
![]() |
![]() |
![]() |
|
12 | 1 | 1 | 15 | 1 |
Tablets / Mobile | |||||
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
18 | 4 | 14 | 1 | 1 | 4.4 |
Last updated by CSSPortal on: 29th March 2024