SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Mar 2010
    Posts
    57
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Mysterious Appearance of Top Margin :S

    Hey guys,

    Here's what happened:

    I created a container, like so:
    HTML Code:
    #container {
    	margin: 0 auto;
    	width: 960px;
    	background-color: #FFF;
    	border: 1px solid;
    }
    then I created the container div on my HTML document like so:
    HTML Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <title>title</title>
    
    <link rel="stylesheet" type="text/css" media="screen" href="style.css" />
    
    </head>
    <body>
        <div id="container">container</div>
    </body>
    </html>
    And I see this mysterious top margin, here:



    The problem occurs on Chrome, Firefox and IE8 (also, the height of the margin seems to be greater on the IE).

    Could this be because of the DTD I am using? I am not very adept with DTD's as yet (neither am I an adept at CSS, evidently lol)

    Thanks!

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,624
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    DTDs won't cause this . It's probably the margins set on the body element.
    Code:
    body{margin:0;}
    Although I think you should know that having an XML declaration above the doctype will trigger quirks mode in IE. Remove that XML declration. Nothing should be above the doctype
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  3. #3
    SitePoint Enthusiast
    Join Date
    Mar 2010
    Posts
    57
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    YOU SIR, I WOULD LIKE TO SHOW MY GRATITUDE BY THANKING YOU VIA ALL-CAPS!

    And I'll remove the XML declaration also

  4. #4
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,624
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    You're welcome lol . I was going to respond back in all caps but it keeps turning it into capitalized words and not uppercase..drats..
    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
  •