CSS colgroup font style problem

HTML & CSS
1

Instead of applying a class to every td in my table, I am using colgroup, however only background-color seems to work on colgroup. When I apply color or any font styles, the colgroup ignores it.


col.col1 {
font-size:0.8em;
color:#ff0000;
background-color:#aaaaaa;
}

<table>
<colgroup>
<col class=“col1” />
<col class=“col2” />
</colgroup>
<tr><td>item</td><td>dat1</td></tr>
<tr><td>item</td><td>dat1</td></tr>
</table>

the first column shows the grey background color(#aaaaaa) but ignores the font styles(color and size). is there a way to style the fonts of my table columns without assigning a class to each and every table cell. I thought colgroup would be my magical solution but it only seems to want to take background color.

2

Apply the style to the tr element instead.

3

That would style the row wouldnt it? I want to style the column.

4

The font-related properties don’t apply for columns or column groups in CSS. That’s mainly because it’s not entirely trivial to figure out to which column a given cell belongs, I believe. Especially with the fixed layout algorithm, which should only require one pass through the table.

See Table formatting in the CSS reference for details about which properties apply.

You’ll need to assign this class to each individual cell (td and th) in that column group, I’m afraid.