Question

How do I select the cells in a table but not the cells of an embedded table? There is a question on how to do this in JQuery. I need to do this in CSS.

<table id="Outer">
    <tr>

        <td> --this one
        </td> 

        <td> --this one
            <table>
                <tr>
                    <td></td> -- but not this one or any deeper nested cells
                </tr>
            </table>
        </td>

    </tr> 
</table>

Answer 1

You can use >, the child selector.
Example:

table#Outer > tbody > tr > td { color: red; }

The child selector selects only direct descendents. More on the child selector: http://meyerweb.com/eric/articles/webrev/200006b.html. But it’s not supported by every web browser: http://www.quirksmode.org/css/contents.html.