#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2013
    Posts
    4
    Rep Power
    0

    White Space at top of Page


    Hi guys, I am new here. I am struggling with some CSS stuff. When applying the following CSS sheet, and I remove the header section, the main container still doesnt sit at the top of the page. There is what looks like a few pixels gap. It is really frustrating. Any ideas what I can do to make the white space go away? Thanks in advance...

    Code:
    @charset "utf-8";
    /* CSS Document */
    /* Resets */
    ul {
        padding:0;
        margin:0 0 20px 0;
        list-style:none;
    }
    h1, h2 {
        padding:0;
        margin:0 0 20px 0;
        font-weight:normal;
    }
    p {
        padding:0;
        margin:0 0 20px 0;
    }
    a:link, a:visited {
        text-decoration:underline;
        color:#000;
    }
    a:hover {
        text-decoration:none;
    }
    ul li {
        padding:5px 0;
    }
    ul li input[type="text"], ul li input[type="password"] {
        width:200px;
    }
    /* Headers */
    h1 {
        font-size:1.8em;
    }
    h2 {
        font-size:1.4em;
    }
    .logo {
        font:2em Arial;
        margin:0 0 10px 0;
        padding:0;
        width:200px;
        color:#fff;
    }
    /* Containers */
    body {
        background:lightslategray;
        font-family:Arial;
        font-size:0.8em;
    }
    #container, footer {
        background:#fff;
        width:920px;
        margin:0 auto;
        padding:20px;
    }
    header {
        width:940px;
        padding:10px;
        margin:0 auto 10px auto;
    }
    #container {
        min-height:500px;
        border-radius:5px 5px 0 0;
    }
    footer {
        border-radius:0 0 5px 5px;
    }
    .widget {
        margin-bottom:20px;
    }
    .widget h2 {
        margin:0 0 10px 0;
        padding:0 5px;
        font-weight:normal;
        border-bottom:1px solid #ddd;
    }
    .widget .inner {
        margin:0 10px;
    }
    /* Navigation */
    nav {
        float:left;
    }
    nav ul {
        margin:0;
    }
    nav ul li {
        display:inline;
        margin-right:10px;
    }
    nav ul li a {
        text-decoration:none;
    }
    nav ul li.current {
        font-weight:bold;
    }
    nav ul li a.last {
        border-right:0;
    }
    /* Aside */
    aside {
        width:260px;
        float:right;
        border-left:1px dashed #aaa;
        padding-left:15px;
    }
    /* Login */
    #login li.link {
        margin-top:5px;
    }
    /* Footer */
    footer {
        border-top:1px dashed #ddd;
        color:#999;
    }
    /* Misc */
    .clear {
        clear:both;
    }
    /* CSS Document */
    Last edited by Kravvitz; April 18th, 2013 at 06:01 PM. Reason: reformatted the code
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2013
    Posts
    17
    Rep Power
    0
    I can probably fix it but I need the html code too.
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Oct 2009
    Location
    Nebraska, USA
    Posts
    862
    Rep Power
    275
    All browsers have their own "default" css style.
    To reset this, just use body{padding:0;margin:0;} .

    That should fix it for you.

IMN logo majestic logo threadwatch logo seochat tools logo