Grouping columns

The <colgroup> and <col> tags let you group columns within the table and apply properties, such as alignment, to the columns without having to specify these properties in each <td> tag.

The <colgroup> tag appears inside the <table> tag; it lets you set the horizontal and vertical alignment of the column group. You can also specify the width of the cells as a percentage of the table or as a number of pixels.

By default the <colgroup> tag defines a single column, you use the span attribute to group several columns together in one group. You can also add several column groups, simply enter more than one <colgroup> tag. For example:

<table>
<colgroup span="2" align="right">
</colgroup>
<colgroup span="3" width="50">
</colgroup>
..the table rows and columns go in here
</table>

This example aligns the first 2 columns in to the table to the right and sets the width of the next three columns to 50 pixels.

If you want to handle columns within a group differently, you use the <col> tag. For example, you have a group of two columns with a border round them but each column needs to be a different width:

<table>
<colgroup>
<col align="left" width="75">
<col align="left" width="200">
</colgroup>
..the table rows and columns go in here
</table>

You can also add the span attribute to the <col> tag.