我有一个产品图像和一个看起来像文件夹的叠加图像，所需的效果是文件夹图像看起来就像它上面有产品图像。这完美！
问题是，文本显示在产品/叠加图像后面，我真的希望它放在下面。我尝试过巧妙地移动关闭的 div，认为这会强制下一个，但它仍然显示在后面。
这是html：
<div class='kit-folder'>
<img class='overlay-image' src='/images/fldr_blue_overlay.png' width='150' height='106' />
<img src='$fldr_image' alt='press kit' class='kit-image' width='150' height='106'/>
Name: $fldr_name<br>Published: $pymnt_date
</div>
这是CSS：
.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;}