css text below overlayed image

razivn

New Member
I have a product image and an overlay image that looks like a file folder with the desired effect being the file folder image looks like it has the product image on top of it. This works perfectly!The problem is, the text is displaying behind the product/overlay images and I really want it placed below. I've tried moving the closing div niavely thinking this would force the next below but it still displays behind.Here's the html:\[code\]<div class='kit-folder'><img class='overlay-image' src='http://stackoverflow.com/images/fldr_blue_overlay.png' width='150' height='106' /><img src='http://stackoverflow.com/questions/14458528/$fldr_image' alt='press kit' class='kit-image' width='150' height='106'/>Name: $fldr_name<br>Published: $pymnt_date</div>\[/code\]Here's the CSS:\[code\].kit-folder {padding:0px; width:auto; position:relative;}img.overlay-image{position:absolute; left:0px; top:0px; z-index:10;}img.kit-image{position:absolute; left:0px; top:0px; z-index:1;}\[/code\]
 
Back
Top