Why does my site: http://www.circuitz4u.com/ have a white border around the outside of the page in safari and google chrome?
OK, I added that code, and it worked, thanks. But when the page is smaller than the window it still displays white at the bottom of the page: http://www.circuitz4u.com/email_sent.php
It does that in Firefox too. Enclose your page in a 'wrapping' div nested as follows: <body> <div id="wrapper> ...the rest of your page. </div> </body> Code (markup): Add this to your css stylesheet: #wrapper {margin:0; padding:0; background-color:#4f5052;} Code (markup):
Sorry about the error. I was hand-typing that in and missed it. It is really hard to look at your CSS file and Html source code when you have everything thrown together into one line of code. Is there a reason for that? It would make things a little easier to debug if you cannot do that.
body { background: #4F5052 url('background.png') repeat-x; font-family: Arial,sans-serif; margin: 0; } a.nav:link,a.nav:active,a.nav:visited { color: #FFFFFF; font-weight: bold; text-decoration: none; } a.nav:hover { color: #FFFFFF; font-weight: bold; text-decoration: underline overline; } #a { height: 100%; margin: auto; padding: 35px 0 0 0; width: 750px; } #b { border: 0; height: 114px; width: 750px; } #c { background: #FFFFFF; color: #7B7D7E; height: auto; margin: auto; width: 750px; } #d { background: #4F5052; height: 25px; padding: 15px 0 0 0; width: 750px; } #e { color: #FFFFFF; font-weight: bold; height: 58px; margin: auto; width: 734px; } .f { background: url('button.png') no-repeat center; cursor: pointer; height: 58px; text-align: center; width: 146px; } .f:hover,.g { background: url('rollover.png') no-repeat center; cursor: pointer; height: 58px; text-align: center; width: 146px; } a.h:link,a.h:visited,a.h:hover,a.h:active { color: #FFFFFF; text-decoration: none; } #i { background: #FFFFFF; font-weight: bold; height: auto; padding: 0 10px 0 10px; width: 730px; } #j { height: 126px; padding: 8px 0 0 32px; width: 438px; } #k { background: #4F5052; height: 68px; padding: 0 0 6px 0; width: 750px; } #l { height: 68px; width: 750px; } a:link,a:visited { color: #BCBEBF; font-family: Arial,sans-serif; text-decoration: none; } a:hover,a:active { color: #7B7D7E; font-family: Arial,sans-serif; text-decoration: none; } a.void:link,a.void:hover,a.void:active,a.void:visited { text-decoration: none; } Code (markup): <!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'> <head> <meta name="generator" content= "HTML Tidy for Windows (vers 14 February 2006), see www.w3.org" /> <link rel="icon" href="favicon.ico" /> <title>Circuit and PCB Designer</title> <link rel='stylesheet' href='layout.css' type="text/css" /> <script type='text/javascript'> //<![CDATA[ function redir(A){window.location=A}; //]]> </script> </head> <body> <div id='a'> <img src='logo.png' id='b' alt='Circuit & PCB Design' /> </div> <div id='c'> <img src='header.png' id='d' alt='header' /> <table id='e'> <tr> <td class='g'>Home</td> <td class='f' onclick='redir("previous_designs.xhtml");'> <a class='h' href='previous_designs.xhtml'>Previous designs</a></td> <td class='f' onclick='redir("price_guide.xhtml");'> <a class='h' href='price_guide.xhtml'>Price guide</a></td> <td class='f' onclick='redir("contact.xhtml");'><a class= 'h' href='contact.xhtml'>Contact me</a></td> <td class='f' onclick='redir("links.xhtml");'><a class='h' href='links.xhtml'>Links</a></td> </tr> </table> <div id='i'> <img style= "width:236px; height:69px; padding:47px 0 18px 32px;" src= 'welcome.png' alt='Welcome' /> <p>My name is Joe Graham. I am a highly experienced and extremely capable circuit designer and can design you a circuit for almost any application. Whether your circuit needs to be: very compact, low power consumption, high performance or low cost I can design the circuit you need. Please see the <a href= 'previous_designs.xhtml'>portfolio</a>.</p> <p>Services I provide include:</p> <ul> <li>Designing electronic circuitry for a specific application</li> <li>Designing PCB layouts for your circuits</li> <li>Finding suitable component suppliers for building your circuits</li> </ul>I prototype, test and verify all circuits to make sure they work.<br /> <p>I charge depending on how complex the design is and how long I think it will take me. Please see the <a href= 'price_guide.xhtml'>price guide</a>. Please <a href= 'contact.xhtml'>e-mail me</a> if you would like a quote or if you have any questions.</p> <p><a href='contact.xhtml'>E-mail me</a></p> </div> <div id='k'> <img src='footer.png' id='l' alt='footer' /> </div> </div> </body> </html> HTML:
That is all fine and dandy dude. I was referring to the files on your Server. I use FF and a couple of extensions to plow thru this stuff. If I had the time to copy/paste this stuff into local files and run it thru my server, I would. But, I don't ... so I won't. Your listing it in a thread does not help, especially when your Div Ids are non-descriptive and use arbitrary ascending letters. IDs and classes should be named something meaningful (ie: #header, #navbar, .navlink, etc.), this will make troubleshooting a whole lot easier. I did notice that you are using 'height' quite a bit in the CSS stylesheet. Not sure what that is all about, but could be one source of your problem. You also took the 'wrapper' div back out. Was going to suggest that you add 'padding:0;' to the BODY element in combination with that. Actually, try adding padding:0; to your BODY element and see if that corrects it.
Hi, I tried adding "padding:0;" to the BODY element and it didn't fix it. I also tried ading the "wrapper" div back in and it didn't work either.