CSS Child Combinator (>) not working

css, css-selectors, html, html-table

Solution

You can try this selector `table.outside > tbody > tr:first-child`but if you share your code, my help would be better.

Problem

For a website I am creating I need to have nested HTML tables. I have styling for the first outside table row (header) that I don't want to be applied for the first rows of the inside tables so I tried using the child combinator like so: ``` table.outside > tr:first-child { # Outside table header row styles } ``` However, the style do not get applied to the header row of the outside table but when I remove the child combinator it works. Here is my HTML: ``` <table class="outside"> <tr><!-- This should be styled --> <th>Column 1</th> <th>Column 2</th> </tr> <tr> <td> <table> <tr><!-- Table Data --></tr><!-- This should not be styled --> <tr><!-- Table Data --></tr> </table> </td> </tr> <!-- Etc. --> </table> ``` What am I doing wrong?

Original source

Related problems