Question

If I have this:

<div id='parent'>
<p>Parent stuff here</p>

  <div id='child'>Child stuff here</div>

</div>

Is there a way to make the parent div appear overtop of the child div without using position:absolute? Basically, you wouldn’t see the child div at all. z-index doesn’t seem to work. I want to do this with a transparent PNG so that I can highlight certain divs on mouseover – the transparentness will allow the under stuff to still be seen a little.

Thanks!

Answer 1

z-index will only work if a position other than static (the default) is set on that element. Add position: relative; to the relevant element and z-index will work. Here is an example: http://jsfiddle.net/sl1dr/8gR6V/