CSS / z-Index / Dividers

Hi I've got the following CSS -


.FlashDiv
{
text-align:center;
position:relative;
border-color:Red;
border-style:solid;
border-width:1px;
z-Index:0;
}

.footerButtons
{
text-align:center;
position:relative;
margin-top: -20px;
z-Index:1;
}


Then I've got the following HTML -


<div class = "FlashDiv">

Flash Object is here

<br />
</div>

<div class ="footerButtons" >
<asp:ImageButton ID="imgbtnContact" runat="server" ImageUrl="~/Images/ContactMe.png" />
</div>


I want the button in the footerbuttons div to overlap the border of the Flash Div and be on top. It looks ok in my designer, but when run in IE the button is underneath the FlashDiv.

Any ideas?

You;d need to set the transparency to the flash object via param/embed tag. See http://kb2.adobe.com/cps/142/tn_14201.html

You;d need to set the transparency to the flash object via param/embed tag. See http://kb2.adobe.com/cps/142/tn_14201.html

Don't understand why that works, as the flash movie is under the button, but hey.. it does work!! Thanks mate :thumbsup: