hello gfx,
You need to clear your float to get #wrapper to enclose the entire page. Change your CSS like this:
* {
margin: 0;
padding: 0;
}
body {
background-color:#2D302C;
background-image:url(images/bg.gif);
color:#222222;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
margin: 0 auto;
text-align: center;
behavior: url(csshover.htc);
}
a {
color:#222222;
text-decoration:none;
}
a:hover {
color:#CCDE8D;
}
img {
border:0;
}
p {
margin-bottom:20px;
line-height:20px;
}
#wrapper {
margin:0 auto;
width:900px;
overflow: hidden;
text-align: left;
background-color:#e8f6bf;
border-top: 1px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}
* html #wrapper {
width: 902px;
}
#header {
background: url('images/newheader.gif');
height: 167px;
}
#footer {
height:35px;
text-align: center;
color: #ffffff;
font-size: 11px;
clear: both;
line-height:35px;
background: url('images/navbar.gif');
background-repeat:repeat-x;
padding:0 10px;
}
#content {
width: 210px;
background-color: #e8f6bf;
text-align: center;
}
#content p {
margin: 0;
padding: 0;
font-family:Verdana, Arial, Trebuchet MS, Helvetica, sans-serif;
font-size: 8pt;
font-weight: normal;
}
#stuff {
width: 660px;
}
#mission {
width: 689px;
height: 85px;
font-weight: bold;
text-align: center;
font-size: 14px;
background: #e8f6bf;
}
#missionbox {
font-weight: normal;
font-size: 13px;
text-align: left;
width: 570px;
}
#mission p {
font-weight: normal;
}
#stuff p {
margin: 0;
padding: 0;
font-family:Verdana, Arial, Trebuchet MS, Helvetica, sans-serif;
font-size: 8pt;
}
#left {
width: 210px;
border-right: 1px solid #e8f6bf;
float: left;
background: #e8f6bf;
}
#right {
width: 689px;
float: right;
background: url('images/logoimprint.gif') #fff;
background-repeat: no-repeat;
background-position: center;
}
.greenhead {
color: #324e1e;
font-size: 13px;
font-weight: bold;
}
.text {
font-family:Verdana, Arial, Trebuchet MS, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #000000;
}
.heading {
font-family:Verdana, Arial, Trebuchet MS, Helvetica, sans-serif;
font-size: 14px;
color: #000000;
font-weight: bold;
text-align: center;
}
* html h1 {
font-size: 18px;
font-weight: bold;
}
Now move the HTML for your footer out of the right column, like this:
from this:
<div id="footer">Copyright © 2006 - All Rights Reserved</div>
</div>
</div>
</body>
</html>
to this:
</div>
<div id="footer">Copyright © 2006 - All Rights Reserved</div>
</div>
</body>
</html>
You need to add a doctype too. Check the links in my sig below.