colspan (HTML attribute)
| IE5.5+ | FF1+ | Saf1.3+ | Op9.2+ |
|---|---|---|---|
| Partial | Full | Partial | Partial |
| Depr. | Version |
|---|---|
| No | HTML 3.2 |
Example
An extract from a calendar, with availability apparently spanning the whole day (see figure):
<tr> <th scope="row">Tue</th> <td colspan="4">Free</td> </tr>
Description
Just as the
th element uses colspans, so can
the td element, whereby data can be shared across
numerous columns in a table. The concept is best explained by comparing
the example HTML above with #colspan/fig-td-colspan (where
someone’s work availability for Tuesday is indicated as free for the whole
day by spanning it across four time slots).
Care must be
taken when introducing a colspan attribute that
everything adds up to same amount of cells. Some tables, however, can get
quite complicated with a mixture of colspan and
rowspan attributes,
and this is not something that you are advised to hand-code, as it is
asking for trouble - it is much better to use a WYSISWYG editor, such as
Dreamweaver, MS Expression or similar, which will allow you to merge and
unmerge cells very easily and will take care of these attributes for
you.
Note that when using the rowspan
attribute, you cannot span a cell beyond the boundary of its containing
rowgroup (namely the thead, tfoot or tbody elements). Hence, if
the tbody comprises 10 rows, the
rowspan of a cell that is defined in the first row
cannot have a value greater than
"10".
Value
A number which should equal the amount
of cells that this single td should take place of.
There is also a special value of "0", which should
inform the browser to span the cell to the end of the current group of
columns.
Compatibility
| IE | 5.5 | Partial |
|---|---|---|
| 6.0 | Partial | |
| 7.0 | Partial | |
| Firefox | 1.0 | Full |
| 1.5 | Full | |
| 2.0 | Full | |
| Safari | 1.3 | Partial |
| 2.0 | Partial | |
| 3.0 | Partial | |
| Opera | 9.2 | Partial |
| 9.5 | Partial |
Browser support for
colspan is generally good, with one exception -
rendering colspan=”0”. Only Firefox was able to span the
cell across all remaining columns properly, the other browsers tested
rendered the cell in only the first column.
User-contributed notes
There are no comments yet.
Add a note
To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.

