Results 1 to 3 of 3

Thread: Simple alignment issue for video with Firefox to IE.

  1. #1
    Join Date
    Jan 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Simple alignment issue for video with Firefox to IE.

    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.

    Code:
    <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
    Last edited by Snookerman; 01-10-2010 at 07:44 PM. Reason: please use [code] [/code] tags

  2. #2
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

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

    Code:
    <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>
    Corrections to my coding/thoughts welcome.

  3. #3
    Join Date
    Jan 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    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?

    be much appreciated.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •