title: z-index between Children and Parents
body: <p>I'm having problems working out the z-index order for an application we're working on, i have two root parents, a nav bar and a map, and one child, the map tooltip. The navbar should be visible above the map, so it has a higher z-index, but the problems is to make the tooltip in the map container to be displayed over the sidebar as well, a bit hard to explain, so you can visualize the case on <a href="http://jsbin.com/afakak/2/edit#javascript,html,live" rel="noreferrer">http://jsbin.com/afakak/2/edit#javascript,html,live</a> : </p>
  
  <pre><code> &lt;div id="nav-bar"&gt;
      The nav bar
    &lt;/div&gt;
  
    &lt;div id="map-container"&gt;
        This is the map container
        &lt;div id="tooltip"&gt;
              This is the Tooltip
        &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>Thanks for any help.</p>