HTML » Tags » colgroup

Version: 4.0

Compability: Explorer 4, 5  Netscape 4, 6

Syntax:
<colgroup> ... </colgroup>

The <colgroup> tag allows you to create a column-centric table as compared to the standard HTML table which is row-centric. The columns in the table are assigned to column groups using this tag. You can have one or more groups of columns.

If you are not using the span attribute of this tag, then you can use the col tag to assign attribute values to the individual columns within the colgroup elements.
 
The colgroup tag can only be used inside a table element. The closing tag is optional. However, it is recommended that it always be included.
 

Examples

Code:
<table width="90%" border="10" cellspacing="5">
<caption>
<center><b>Column Group Table</b></center>
<br>
This table uses the <b>colgroup</b> and <b>col</b> tags
</caption>
<colgroup>
<col width="20%">
<col width="30%">
<col width="15%">
</colgroup>
<colgroup>
<col width="15%">
<col width="20%">
</colgroup>
<tr>
<th>First Column Header</th>
<th>Second Column Header</th>
<th>Third Column Header</th>
<th>Fourth Column Header</th>
<th>Fifth Column Header</th>
</tr>
<tr>
<td>First Column First Row</td>
<td>Second Column First Row</td>
<td>Third Column First Row</td>
<td>Fourth Column First Row</td>
<td>Fifth Column First Row</td>
</tr>
<tr>
<td>First Column Second Row</td>
<td>Second Column Second Row</td>
<td>Third Column Second Row</td>
<td>Fourth Column Second Row</td>
<td>Fifth Column Second Row</td>
</tr>
</table>
Output:
Column Group Table

This table uses the colgroup and col tags
First Column HeaderSecond Column HeaderThird Column HeaderFourth Column HeaderFifth Column Header
First Column First RowSecond Column First RowThird Column First RowFourth Column First RowFifth Column First Row
First Column Second RowSecond Column Second RowThird Column Second RowFourth Column Second RowFifth Column Second Row
Language(s): HTML

See Also: