|
This has worked for me in the past, just copied and pasted from source code and css file of a live site so it will have some unnecessary code:
HTML:
<div class="model"><img src="images/model_01.jpg"><div class="overlay"></div>
<a href="#"></a></div>
CSS:
.model {
display:inline;
float:left;
height:150px;
margin:0 0 0 25px;
position:relative;
width:120px;
}
.model img {
height:150px;
width:120px;
}
.model .overlay {
background:url(images/overlay.png) no-repeat;
display:block;
height:150px;
left:0;
position:absolute;
top:0;
width:120px;
z-index:2;
}
.model a {
display:block;
left:0;
height:150px;
position:absolute;
top:0;
width:120px;
z-index:4;
}
|