Hi peeps,
Not an experienced web designer, I'm just trying to build my personal site with Dreamweaver. I'm progressing, slowly, but I have just changed the page background colour and I get this:

You can see the dotted line around the copyright info div. I don't want that because it leaves a white strip between the last div and the background colour.
I can't see any padding or similar tags that might cause this. Any ideas?
There's also the javascript and CSS for the menu if you need that to diagnose.
I'm in your hands, gents!
Not an experienced web designer, I'm just trying to build my personal site with Dreamweaver. I'm progressing, slowly, but I have just changed the page background colour and I get this:

You can see the dotted line around the copyright info div. I don't want that because it leaves a white strip between the last div and the background colour.
I can't see any padding or similar tags that might cause this. Any ideas?
Code:
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Patrick Graham Photography</title> <link href="styles/main.css" rel="stylesheet" type="text/css"> <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script> <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css"> <style type="text/css"> body { background-color: #F0F0F0; } </style> </head> <body> <div id="container"> <div id="banner"><img src="images/logo.png" width="450" height="75" alt="Patrick Graham Photography"></div> <div id="menu"> <ul id="MenuBar1" class="MenuBarHorizontal"> <li><a class="MenuBarItemSubmenu" href="#">Aesthetic</a> <ul> <li><a href="#">Item 1.1</a></li> <li><a href="#">Item 1.2</a></li> <li><a href="#">Item 1.3</a></li> </ul> </li> <li><a href="#">Conceptual</a></li> <li><a class="MenuBarItemSubmenu" href="#">Experimental</a> <ul> <li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a> <ul> <li><a href="#">Item 3.1.1</a></li> <li><a href="#">Item 3.1.2</a></li> </ul> </li> <li><a href="#">Item 3.2</a></li> <li><a href="#">Item 3.3</a></li> </ul> </li> <li><a href="#">Typology</a></li> </ul> </div> <div id="content"> <!--START SIMPLEVIEWER EMBED.--> <iframe src="SimpleViewer/index.html" width="600" height="600" frameborder="0" scrolling="no"> <script type="text/javascript" src="svcore/js/simpleviewer.js"></script> <script type="text/javascript"> $(document).ready(function () { SV.simpleviewer.load("sv-container", "100%", "100%", "FFFFFF", true); }); </script> <div id="sv-container"></div></iframe>` <!-- END SIMPLEVIEWER EMBED --> </div> <div id="copyright"> <p> </p> <p>© Copyright Patrick Graham, 2001-2010, All Rights Reserved.</p> <p> </p> </div> </div> <script type="text/javascript"> var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"}); </script> </body> </html>
Code:
@charset "UTF-8"; /* CSS Document */ #container { width: 968px; background: #FFF; margin: 0 auto; # padding-left: 10px; # padding-right: 10px; overflow: hidden; text-align: center } body { font-family: Verdana, Geneva, sans-serif; color:#CCC; background-color: #FFF; } #banner { background: #F0F0F0; } #copyright { background: #F0F0F0; font-size: 14px; }
I'm in your hands, gents!

Comment