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="default.css" /> <link rel="shortcut icon" href="favicon.ico" /> <script src="nav_hover.js" type="text/javascript"></script> </head> <body> <div class="header-container"> <img src="http://007vg.com/images/logo.png" class="logo" alt="" /> <div class="navigation"> <img src="http://007vg.com/images/menu/left.png" alt="" /><a href="http://007vg.com/"><img src="http://007vg.com/images/menu/home_normal.png" onmouseover="document.home.src=image1.src" onmouseout="document.home.src=image0.src" name="home" alt="" /></a><a href="http://007vg.com/n64"><img src="http://007vg.com/images/menu/N64_normal.png" onmouseover="document.n64.src=image3.src" onmouseout="document.n64.src=image2.src" name="n64" alt="" /></a><a href="http://007vg.com/gcn"><img src="http://007vg.com/images/menu/GCN_normal.png" onmouseover="document.gcn.src=image5.src" onmouseout="document.gcn.src=image4.src" name="gcn" alt="" /></a><a href="http://007vg.com/wii"><img src="http://007vg.com/images/menu/wii_normal.png" onmouseover="document.wii.src=image7.src" onmouseout="document.wii.src=image6.src" name="wii" alt="" /></a><a href="http://007vg.com/movies"><img src="http://007vg.com/images/menu/movies_normal.png" onmouseover="document.movies.src=image9.src" onmouseout="document.movies.src=image8.src" name="movies" alt="" /></a><img src="http://007vg.com/images/menu/mid.png" alt="" /><img src="http://007vg.com/images/menu/right.png" alt="" /> </div> <div class="body-top"> <img src="http://007vg.com/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 /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /> </div> </div> <div class="footer-container"> <div class="footer"><img src="http://007vg.com/images/footer.png" alt="" /></div> </div> </div> </body> </html> Code (markup): default.css body{ font-family: Calibri; margin: 0 auto; } img{ border: 0; margin: 0; padding: 0; } .header-container{ background: url(http://007vg.com/images/header_background.png) repeat-x; height: auto; width: 1000px; } .logo{ height: 288px; margin-left: auto; margin-right: auto; width: 1000px; } .navigation{ height: 60px; margin-left: auto; margin-right: auto; width: 834px; } .body-top{ height: 27px; margin-left: auto; margin-right: auto; width: 834px; } .middle-container{ background: url(http://007vg.com/images/background.png) repeat; height: auto; margin-left: auto; margin-right: auto; width: 1000px; } .body-middle{ background: url(http://007vg.com/images/body_middle.png) repeat-y; height: auto; margin-left: auto; margin-right: auto; text-align: center; width: 834px; } .h2{ color: #444; font-size: 20px; } .footer{ margin-left: auto; margin-right: auto; width: 850px; } .footer-container{ background: url(http://007vg.com/images/footer_background.png) repeat-x; height: 232px; width: 1000px; } Code (markup): http://007vg.com Notice that small white gap right where the red turns into black on the left/right side? I can't seem to fix that. I've tried a lot of stuff.
Use This! body { font-family:Calibri; margin:0 auto; } img { border:0 none; margin:0; padding:0; } .header-container { background:url("http://007vg.com/images/header_background.png") repeat-x scroll 0 0 transparent; height:auto; width:1000px; } .logo { height:288px; margin-left:auto; margin-right:auto; width:1000px; } .navigation { height:60px; margin-left:auto; margin-right:auto; width:834px; } .body-top { height:25px; margin-left:auto; margin-right:auto; width:834px; } .middle-container { background:url("http://007vg.com/images/background.png") repeat scroll 0 0 transparent; height:auto; margin-left:auto; margin-right:auto; width:1000px; } .body-middle { background:url("http://007vg.com/images/body_middle.png") repeat-y scroll 0 0 transparent; height:auto; margin-left:auto; margin-right:auto; text-align:center; width:834px; } .h2 { color:#444444; font-size:20px; } .footer { margin-left:auto; margin-right:auto; width:850px; } .footer-container { background:url("http://007vg.com/images/footer_background.png") repeat-x scroll 0 0 transparent; height:232px; width:1000px; } Code (markup):
Watch it with 1280x1024 resolution. I would not use 1000px width. I would do 960px. When watchin 1024x768 resolution I can scroll some pixel to the right. not a good thing
I have several browsers installed. It has nothing to do with OS/browser. I have 1920x1080 resolution but I am using the program sizer to resize the browser windows to e.g. 1024x768
No it's for sure not my problem. I am doin websites for years, so I don't think you need to tell me how it works. The problem is that your site has a "white side" when you go over 1024x768 (resize your browser). Look here, dude. One screenshot of the viewport browser res 1024x768 And now 1280x1024 res You see the difference no?
You may need to save the graphics to your desktop and open it with a graphic program, you won't see the "white space" on the right then
Nah mate, you should do something complete different When I got some spare time I'll show you what I mean Basically I would do a resizeable background-image and a centered layout with 960px fixed width. Let me grab your site with httrack
Now download and unpack this... http://labs.cookielessdomain.com/007vg.com.zip Centered, 960px width. Laters
Well I regged years ago and I used to run browsershots factories too. I will check for you and will show you then. By the way, I saw you do not use my "template" completely, the header logo is not centered with 1280x1024 res.
Here is a screenshot from Safari 5.x for Windows 1280 pixel screen width: This is your version And now my version (located here: http://labs.cookielessdomain.com/007vgcom/ )