White at Bottom of Page

Discussion in 'HTML & Website Design' started by Pudge1, Feb 5, 2011.

  1. #1
    Look at 007vg.com,
    How do I get rid of that white space that is at the bottom of the page? I've been looking over my code but I just can't figure it out.

    index.htm
    
    
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
        "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
     
     
     
    <head> 
      <title>007 Video Games: Walkthroughs, Guides and Cheats</title> 
     
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
      <meta name="description" content="Guides, Walkthroughs and Cheats for the latest 007: James Bond Games." /> 
      <meta name="copyright" content="Copyright 2009-2010" /> 
      <meta name="keywords" content="007 video games cheats walkthroughs guides goldeneye twine auf rogue agent wii" /> 
     
      <link rel="stylesheet" href="http://007vg.com/default.css" /> 
      <link rel="shortcut icon" href="http://007vg.com/favicon.ico" /> 
     
      <base href="http://007vg.com/" /> 
     
      <script src="nav_hover.js" type="text/javascript"></script> 
      <script src="view_video.js" type="text/javascript"></script> 
      <script type="text/javascript"> 
     
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-6888871-2']);
      _gaq.push(['_trackPageview']);
     
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
      })();
     
    </script> 
    </head> 
     
    <body> 
     
    <div class="header-container"> 
     
    <div class="logo"><img src="images/logo.png" alt="007 Video Games" /></div> 
     
    <div class="navigation"> 
     
    <a href="http://007vg.com/"><img src="images/menu/home_normal.png" onmouseover="document.getElementById('home').src=image1.src" onmouseout="document.getElementById('home').src=image0.src" id="home" alt="" /></a><a href="http://007vg.com/n64"><img src="images/menu/N64_normal.png" onmouseover="document.getElementById('n64').src=image3.src" onmouseout="document.getElementById('n64').src=image2.src" id="n64" alt="" /></a><a href="http://007vg.com/gcn"><img src="images/menu/GCN_normal.png" onmouseover="document.getElementById('gcn').src=image5.src" onmouseout="document.getElementById('gcn').src=image4.src" id="gcn" alt="" /></a><a href="http://007vg.com/wii"><img src="images/menu/wii_normal.png" onmouseover="document.getElementById('wii').src=image7.src" onmouseout="document.getElementById('wii').src=image6.src" id="wii" alt="" /></a><a href="http://007vg.com/movies"><img src="images/menu/movies_normal.png" onmouseover="document.getElementById('movies').src=image9.src" onmouseout="document.getElementById('movies').src=image8.src" id="movies" alt="" /></a><img src="images/menu/mid.png" alt="" /><img src="images/menu/right.png" alt="" /> 
     
    </div> 
     
    <div class="body-top"> 
     
    <img src="images/body_top.png" alt="" /> 
     
    </div> 
     
    <div class="middle-container"> 
     
    <div class="body-middle"> 
    <span class="h2">007 Video Games</span> 
     
    <br /><br /><br /><br /><br /> 
    <b style="text-align: center;">We are still working on some things! You may see some missing content on the site for right now. Site will launch July 2011!</b><br /><br /> 
    <b style="text-align: center; font-size: 20px;">In the mean time check out our contest for our FREE copy of Goldeneye 007 for Wii <a href="http://007vg.com/contest.php">HERE</a></b> 
    </div> 
     
    </div> 
     
    <div class="footer-container"> 
     
    <div class="footer"><img src="images/footer.png" alt="" /></div> 
     
    </div> 
     
    </div> 
     
    <img
    src="http://c.statcounter.com/6391983/0/7efc38b1/1/"
    alt="" border="0"> 
     
    </body> 
     
     
    </html>
    
    Code (markup):
    default.css
    
    /*BODY SETTINGS*/
    
    body {
      font-family:Calibri;
      margin:0 auto;
    }
    
    img {
      border:0 none;
      margin:0;
      padding:0;
    }
    
    /*HEADER*/
    
    .header-container {
      background:url("images/header_background.png") repeat-x scroll 0 0 transparent;
      height:auto;
      width:100%;
    }
    
    .logo {
      height:288px;
      margin-left:auto;
      margin-right:auto;
      width:960px;
    }
    
    .navigation {
      height:60px;
      margin-left:auto;
      margin-right:auto;
      width:834px;
    }
    
    /*BODY*/
    
    .body-top {
      height:25px;
      margin-left:auto;
      margin-right:auto;
      width:834px;
    }
    
    .middle-container {
      background:url("images/background.png") repeat scroll 0 0 transparent;
      height:auto;
      margin-left:auto;
      margin-right:auto;
      width:100%;
    }
    
    .body-middle {
      background:url("images/body_middle.png") repeat-y scroll 0 0 transparent;
      height:auto;
      margin-left:auto;
      margin-right:auto;
      text-align:center;
      width:834px;
    }
    
    .body-middle a{
      color: #000;
      font-weight: bolder;
      text-decoration: underline;
    }
    
    .body-middle a:hover{
      color: #AF0C07;
      font-weight: bolder;
      text-decoration: underline;
    }
    
    select{
      text-align: center;
      font-family: Calibri;
      font-weight: bold;
      font-size: 22px;
      background-color: #A20602;
    }
    
    input[type="submit"]{
      text-align: center;
      font-family: Calibri;
      font-weight: bold;
      font-size: 22px;
      color: #FFF;
      background-color: #3B3B3B;
      border: 2px solid #000;
    }
    
    #game-nav a{
      color: #2A2A2A;
      font-weight: bolder;
      text-decoration: none;
    }
    
    #game-nav a:hover{
      color: #8C0300;
      font-weight: bolder;
      text-decoration: none;
    }
    
    /*FOOTER*/
    
    .footer {
      margin-left:auto;
      margin-right:auto;
      width:850px;
    }
    
    .footer-container {
      background:url("images/footer_background.png") repeat-x scroll 0 0 transparent;
      height:232px;
      width:100%;
      margin:0;
    }
    
    /*TEXT FORMATTING*/
    
    .h2 {
      color: #444;
      font-size: 30px;
      font-weight: bolder;
    }
    
    p{
      padding-left: 15px;
      text-indent: 20px;
    }
    
    p.red{
      color: #A40D0D;
      padding-left: 15px;
      text-indent: 20px;
    }
    
    b{
      font-weight: bolder;
    }
    
    Code (markup):
    Here is a picture of what I'm talking about:
    [​IMG]
     
    Pudge1, Feb 5, 2011 IP
  2. Dodger

    Dodger Peon

    Messages:
    1,494
    Likes Received:
    60
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Move that image stat tracker inside of your main div for header-container. Or set your body background color to #202021. Either one will get rid of it.
     
    Dodger, Feb 5, 2011 IP
    Pudge1 likes this.
  3. Pudge1

    Pudge1 Well-Known Member

    Messages:
    912
    Likes Received:
    6
    Best Answers:
    1
    Trophy Points:
    140
    Digital Goods:
    1
    #3
    Thanks so much, that fixed it!
     
    Pudge1, Feb 6, 2011 IP
  4. Dodger

    Dodger Peon

    Messages:
    1,494
    Likes Received:
    60
    Best Answers:
    0
    Trophy Points:
    0
    #4
    You're welcome.
     
    Dodger, Feb 6, 2011 IP