Table Column Formatting

col, css, css-tables

Solution

As far as I know, you can only format the following using CSS on the `<col>` element:

- background-color

- border

- width

- visibility

This page has more info.

Herb is right - it's better to style the `<td>`'s directly. What I do is the following:

<style type="text/css">
   #mytable tr > td:first-child { color: red;} /* first column */
   #mytable tr > td:first-child + td { color: green;} /* second column */
   #mytable tr > td:first-child + td + td { color: blue;} /* third column */
   </style>
   </head>
   <body> 
   <table id="mytable">
    <tr>
      <td>text 1</td>
      <td>text 2</td>
      <td>text 3</td>
    </tr>
    <tr>
      <td>text 4</td>
      <td>text 5</td>
      <td>text 6</td>
    </tr>
    </table>

This won't work in IE however.

Problem

I'm trying to format a column in a `<table/>` using a `<col/>` element. I can set `background-color`, `width`, etc., but can't set the `font-weight`. Why doesn't it work? ``` <table> <col style="font-weight:bold; background-color:#CCC;"> <col> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </table> ```

Original source