Simple alignment issue for video with Firefox to IE.

[webdesign]

Hi all.

This problem has been bugging me for weeks and I've been unable to find a solution so far. I'm sure there's a simple answer..
I'm helping to design a Myspace layout for a band. I've got a video that displays centrally and above the Myspace banner on Firefox and on Safari, which is exactly how it should be. In Internet Explorer however, it is always positioned to the right, not centrally. The part of the Myspace code for the video is below. The 'margin left' is set to -322 to allow for the video to display centrally on Firefox and Safari. In IE the 'margin left' needs to be set to more than -600 for it to display centrally. Also, there is a central align code so that the video stays central regardless of the box/screen/window size, but there is still this massive difference on Firefox to IE.
Please help me get the video to display central in both Firefox and IE! The web address is: http://www.myspace.com/thedirtyrich and the code is below.


<style>
body {
background-position:top center;margin-top: 510;}

div.topbanner {
top: 0px;
align="center"
left: 0%;
margin-left: -322px;
margin-right: 0px;
width: 0%;
height: 100px;
position: absolute;
}
</style>

<div class="topbanner">
<center>


<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" height="510" width="840">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://www.youtube.com/v/pyo0Z3it248&hl=en_US&fs=1&" />
<param name="wmode" value="transparent" />
<embed type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" src="http://www.youtube.com/v/pyo0Z3it248&hl=en_US&fs=1&" height="510" width="840" wmode="transparent" />
</object>


</center>
</div>

Many thanks..

Urban

[bluewalrus]

I don't have IE so I can't test that but there are some things in your code you should fix.


<style type="text/css">
body {
background-position:top center;margin-top: 510px;}
div.topbanner {
position: absolute;
top: 0px;
text-align: center;
left: 0%;
//have you tried margin:auto;
margin-left: -322px;
margin-right: 0px;
width: 0%;
height: 100px;
}
</style>

[webdesign]

Hi bluewalrus

I'm afraid your correction makes it worse in my case. When using your amended code, the video will not center to the window, therefor on larger screens the video appears to the left, and on smaller screens the video appears to the right. I need to video to be central whatever the screen size. Has anybody got any suggestions on how to get this video central on Firefox AND IE?

:confused: be much appreciated.