Web Design in a Nutshell, 3rd Edition

The col element is used to label or to apply attribute specifications to an individual column (or across several columns via the span attribute) without actually grouping the columns together structurally or conceptually. An empty element, col is used only to apply attributes or styles to the columns to which it refers.

The colgroup element defines a conceptual group of columns. The number of columns included in the group is indicated with the span attribute or by the total of col elements (with their span values) within the column group. Attributes, such as width or align, applied to the colgroup element apply to every column within that group.

The colgroup and/or col elements must appear before any row or row group elements. They are placed either immediately after the table start tag or immediately after the caption element, if there is one. In this example, column group information has been added to the previous sample table markup.

    <table>


    <colgroup id="employinfo">
       <col span="2" width="100" />
       <col span="1" width="50" class="date" />
    </colgroup>


    <thead>
    <tr><th>Employee</th><th>Salary</th><th>Start date</th></tr>
    </thead>


    <tfoot>
    <tr><td colspan="3">Compiled by Buster D. Boss</td></tr>
    </tfoot>


    <tbody>
    <tr><td>Wilma</td><td>5,000</td><td>April 6</td></tr>
    <tr>... more data cells...</tr>
    <tr>... more data cells...</tr>
    </tbody>


    </table>

The colgroup element identifies the three columns as part of the same structural group. (There may be many column groups in a table, but for ...