title: css 3d transforms and zindex fighting
body: <p>I have two <code>&lt;div&gt;</code> elements that overlap eachother, like:</p>
  
  <pre><code> -------------
   |           |
   |     A     |
   |           |
   |   ------------
   |   |          |
   |   |          |
   ----|     B    |
       |          |
       ------------
  </code></pre>
  
  <p>So I add B to the DOM after A.  Inside div A I have some other html elements (images) that I apply css3d transforms to, however when I do this they also appear infront of div B, I always want div B to be above div A and all of its content.  I tried setting the z-index property on both div elements but the 3d transformed items in A still render ontop of div B.</p>
  
  <p>Any way to always make B appear infront of A and it's content?</p>
  
  <p>Thanks
  Mark.  </p>