SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot
    Join Date
    Jun 2003
    Location
    India
    Posts
    160
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Center a div with CSS on IE8

    I have following code

    Code:
    <html>
    <head>
    <title>Welcome</title>
    <style>
    #container {width: 800px; margin: 0 auto; border: thin solid #ccc; background-color: #fff;}
    </style>
    </head>
    
    <body bgcolor=#36393D>
    
    <div id="container">
    welcome
    </div>
    
    
    </body>
    </html>
    I wanted div with id container show in center of screen with margin on left and right. So on high resolution monitors, site display in center.

    It works find on Firefox, but it display left aligned on IE 8.

    Anyone know how to get it centered in IE 8 ?

  2. #2
    Non-Member
    Join Date
    Jun 2010
    Location
    4727′35″N 2618′0″E
    Posts
    1,789
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You don't have a DTD declared on your document. That makes IE go into quirks mode. Try this:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
      "http://www.w3.org/TR/html4/strict.dtd">
    
    <html lang="en"><head>
    
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <title>Welcome</title>
    
      <style type="text/css">
        body {
            background:#36393D;
            text-align:center;
          }
          
        #container {
            text-align:left;
            width:800px; 
            margin:0 auto; 
            border:thin solid #ccc; 
            background-color:#fff;
          }
      </style>
    
    </head><body>
      <div id="container">
        <h1>Welcome</h1>
      </div>
    </body></html>

  3. #3
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,622
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    To further explain, IE reverts to IE5.5 in quirks mode when no doctype is declared, and IE5.5 doesn't support auto margins (aka centering block elements via that).
    Always looking for web design/development work.
    http://www.CodeFundamentals.com


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
  •