Select first list in table - CSS first-child?

Question

Hi, maybe I'm barking up the wrong tree. I'm have a table with 6 columns, each with an ordered list in. I want them all to have a border except for the first list.

The site is in development here Basically though the html is

<tr>
 <td>
   <ol>
    <li>hello</li>
   </ol>
 </td>
 <td>
   <ol>
    <li>hello</li>
   </ol>
 </td>
 <td>
   <ol>
    <li>hello</li>
   </ol>
 </td>
</tr>

I thought the first-child of tr would work like so tr:first-child ol {style}

Answer 1

The :first-child selector is CSS2 and isn't supported on IE6. If IE6 is important then you'll need to give the first child a class you can select on instead. But the correct syntax is:

tr td:first-child ol { ... }

When you do:

tr:first-child ...

you're actually selecting <tr> elements that are first children. Also be aware that:

tr :first-child ...

is selecting the first children of table rows.

Answer 2

That's not quite how it works, tr:first-child ol selects the tr that is the first child of its parent element. You must use the first-child pseudoclass on the td instead.