How to avoid a specific ID inside element in CSS?

Question

I have this structure in html

<div id="A">
   ....
   <div id="B">
      ....
   </div>
   ....
</div>

How can I write a CSS rule, that says, make all a tags color white inside #A, but ignore what's in #B?

I would prefer to have something like :not(#B) and not put another wrapper tag or anything too hardcoded.

Thanks

Answer 1

Best solution (although still not perfext):

(Corrected after the comment and with the code of @Amit)

/* Either directly under #A, or in an element in #A that's not #B */
/* The element that's not #B must be a direct child of #A, otherwise */
/* children of children of #B will be selected anyway, as @Amit pointed out. */
#A > a, #A > :not(#B) a { color:red }

<div id="A">
   <a>red</a>
   <div id="B">
      <a>black</a>
      <p>
        <a>black</a>
      </p>
   </div>
   <p>
     <a>red</a>
   </p>
</div>

This still has problems (IE 9+ and not working if #B is wrapped), but it is the best solution we've got.

Incorrect, failing solution (just to show what's wrong):

#A > a, #A :not(#B) a { color:red }

<div id="A">
   <a>red</a>
   <div id="B">
      <a>black</a>
      <p>
        <a>black</a>
      </p>
   </div>
   <p>
     <a>red</a>
   </p>
</div>

Answer 2

Why not do simply:

#A a {
 color:#fff;
}
#B a {
 color:green;
}