[Solved] HELP - wrapper doesn't contain entire page

Hello, I am extremely new at css, just learning now from other templates and tutorials I have found on the internet. Pretty much all the design jobs in my area have started requiring CSS knowledge or consider it a plus. So I guess it's time to get wit it. . . anyway, heres the problem . . .

#wrapper only goes below the navigation bar, even though it's div is closed at the end of the document? . . . I want it to be a container for the whole page, not just the header and nav bar, it should contain #centercolumn #rightcolumn and #footer, any one have some insight on this?

Preview code at
http://www.godly411.com/

CSS CODE

* {

padding: 0;

margin: 0;

}

body {

font-family: Arial, Helvetica, sans-serif;

color: #666666;

font-size: 12px;

}

#wrapper {

width: 915px;

margin: 0 auto;
border: 1px solid #ccc;

}

#navbar {

border: 1px solid #ccc;

margin: 5px 5px 5px 5px;

padding: 4px;

background-color: #A3A38F;

}

#header {

border: 1px solid #ccc;

margin: 5px 5px 0px 5px;

height: 105px;

padding: 0px;

background-color: #C9C9BE;

}

#centercolumn { /* Parent Wrapper for inside boxes */

border: 1px solid #ccc;

margin: 0px 5px 0px 5px;

display: inline; /* IE Hack */

padding: 4px;

width: 71.3%;

float: left;

min-height: 300px;

}

* html #centercolumn {height:300px} /* IE Min-Height Hack */

#rightcolumn {

margin: 0 5px 0px 0px;

padding: 4px;

display: inline; /* IE Hack */

width: 24%;

float: left;

border: 1px solid #ccc;

background-color: #DAC8BF;

min-height: 300px;

}

* html #rightcolumn {height:300px} /* IE Min-Height Hack */

#footer {

background-color: #A3A38F;

margin: 5px 5px 5px 5px;

display: inline; /* IE Hack */

padding: 4px;

float: left;

width: 97.7%;

}

HTML CODE

CSS Layouts - 2 Column Layout - 15

This is my Navigation Bar

This Column is My Main Content Area

 

 

 

 

 

 

 

 

This is my Right Column