Different positions of layer in Firefox, Safari and IE

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Florian Roeper
    New Member
    • Dec 2010
    • 2

    Different positions of layer in Firefox, Safari and IE

    Hi All,

    Can someone show me how to position this slideshow so that it's roughly in the same position on Safari, FF and IE? Currently it's centered properly only in FF, and waaaay off in the other 2 browsers.

    Here's the page:

    http://www.studioroepe r.com/

    Thx!
  • drhowarddrfine
    Recognized Expert Expert
    • Sep 2006
    • 7434

    #2
    You are in 'quirks mode' which, essentially, makes everything 1998 all over again. Make this your first line:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    Cool stuff, btw.

    Comment

    • Florian Roeper
      New Member
      • Dec 2010
      • 2

      #3
      thanks drhoward,
      yes, my code is ancient, but i managed to tweak it a little so it works:

      <div id="Layer1" style="position :absolute; left:50%; margin-left:-309px; top:50%; margin-top:-195px; width:617px; height:391px; z-index:1;">

      309left and 195top signify half of my layer size. maybe not the most modern solution, but my site is such a crazy patchwork anyway.

      i tried your suggestion: the layer centers both vertically and horizontally, but everything else on the page centers only horizontally, always aligned on the top of the page. any way to make this align vertically too?

      Comment

      • drhowarddrfine
        Recognized Expert Expert
        • Sep 2006
        • 7434

        #4
        The problem you will continue to have, without the doctype, is that IE will place margins and padding in the wrong place compared to the modern browsers and you will always have to specify margin/padding for all elements. (Reason #7362 why no one should use IE.)

        Doctypes have been required on all web pages since 1999. You should have one, too.

        Comment

        Working...