Hey Guys, i am having trouble placing this image over a youtube video, I want the .youtube_hat to be displayed over the youtube video in the top corner. So could anyone please help me!!
The HTML
<div class="youtube_area">
<div class="youtube_hat"></div>
<div class="youtube">
<iframe title="YouTube video player" width="450" height="258" src="http://www.youtube.com/embed/B-1Xqnx-KCw?rel=0" frameborder="0" allowfullscreen></iframe>
</div>
</div>
The CSS
.youtube_hat {
position: absolute;
margin: -75px 0 0 -72px;
width: 210px; height: 157px;
background: url(../img/youtube_hat.png) no-repeat top left;
z-index: 1;
}
.youtube_area {
position: absolute;
top: 227px;
left: 592px;
}
.youtube {
position: absolute;
width: 450px; height: 258px;
z-index: 5;
}
Thanks for your help,
Marais