Question

I am making an ebay storefront and need to style an element on the page which I have no ability to edit the html of.

The html is something like this

<td id="blah">
  <div>
    <div>....

    </div>
  </div>
  <div>....

  </div>
</td>

I need to add a margin to both the div’s

..but not the children divs of those divs

the css I tried was #blah div {margin:5px;} but of course that effected the child divs.

Answer 1

There is the > “immediate child” selector:

#blah > div {margin:5px;}

but it’s not supported by IE6, which sadly still is a consideration for many audiences.

It’s preferable to add a class to the box you want to style:

<td id="blah">
  <div class="box">
    <div>....

and specify that:

#blah div.box {margin:5px;}