on :hover cover all elements within div?

[liamloveslearning]

Hi all,

 

I have a div containing a thumbnail and an image, eg...

<div class="box">
<img src="myimg.jpg" /><p>text</p>
</div>

 

I have the style...

.box {width:100px; height:100px; display:block; float:left;}
.box:hover { background-image:my background image.jpg; }

 

Only when I hover over my div the background image is being called only it shows BENEATH the image inside. I've tried changing z-indexes with no luck, Any ideas?

[otuatail]

are you trying to swap the image in a mouse over event?

Desmond.