HTML Rowspan & Colspan

What is colspan?

The colspan attribute allows a cell to span across multiple columns:

<table border="1">
  <tr>
    <th colspan="2">Employee Details</th>
  </tr>
  <tr>
    <td>Name</td>
    <td>Alice</td>
  </tr>
</table>
            

What is rowspan?

The rowspan attribute allows a cell to span across multiple rows:

<table border="1">
  <tr>
    <th rowspan="2">Name</th>
    <td>Alice</td>
  </tr>
  <tr>
    <td>Bob</td>
  </tr>
</table>
            

Combined Example

Here’s an example combining both rowspan and colspan:

<table border="1">
  <tr>
    <th rowspan="2">Department</th>
    <th colspan="2">Employees</th>
  </tr>
  <tr>
    <td>Alice</td>
    <td>Bob</td>
  </tr>
</table>
            

Best Practices

• Use rowspan and colspan to group similar data for better readability.
• Keep table layout simple and clear.
• Combine with CSS to maintain alignment and spacing.