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:
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.