CSS: Selecting table's <td> without the <td>s of nested tables

Question

How do you select the td elemennts of a table, without the td's of the nested tables ?
I thought of the following selector: table > tbody > tr > td to make sure I don't have the td elements of the nested tables, but I guess there is a better way ?

Answer 1

So you have this?

<table id="outer">
   <tbody>
      <tr>
         <td>
            <table id="anotherTable">
            ...
            </table>
         <td>
      <tr>
   </tbody>
</table>

And you want to only select td's in the root table.

#outer>tbody>tr>td

Just like you entered in your question (direct child selectors).

Answer 2

Easiest way is to add an id or class to that outermost table, an then use that in your selector:

table#id > tbody > tr > td