Web4College

HTML colspan attribute

HTML colspan attribute allows a cell to contain or span more than one columns. In other words, two or more cells are merged and the resulting cell contains spans two or more columns.

Example
Try it
<table border="2">
<caption>Usage Stats of Browsers</caption>
 <tr>
  <th>Browsers</th>
  <th colspan="3">Months(2017)</th>
 </tr>
 <tr>
  <th></th>
  <th>January</th>
  <th>February</th>
 </tr>
 <tr>
  <td>Chrome</td>
  <td>62.07%</td>
  <td>62.97%</td>
 </tr>
 <tr>
  <td>Firefox</td>
  <td>14.87%</td>
  <td>14.83%</td>
 </tr>
</table>
Usage Stats of Browsers
BrowsersMonths(2017)
JanuaryFebruary
Chrome62.07%62.97%
Firefox14.87%14.83%

In the above example, a cell contains two columns because we have used 2 value of colspan attribute.

Attribute values

All possible values of colspan attribute

The value of colspan attribute is a valid positive integer. And this integer is the number of columns spanned by the cell.


2 value of rowspan attribute allows a cell to contain two rows i.e. it merges two cells.

Preview Example
Try it

Related Tags

The tags that support colspan attribute

<th> tag

<th> tag defines a cell of data in the heading section of the table. It supports the colspan attribute.

<td> tag

<td> tag defines a cell of data in the body section of the table. colspan attribute is applicable on the <td> tag