[SOLVED] Floating Content and Footer Below help

[liamloveslearning]

Hi everyone, im trying to produce a very basic skeleton of a header div, content div (containting 2 divs, 1 floats left, 1 right) and then a footer div which should sit below the content, however it doesnt, Ive tried absolutely positioning it but to no avail, if anybody can help id be really greatful, heres my source code

 

src

<div id="container">

  <div id="header">
    	<div id="topbar">asd</div>
  </div>
   
   
   			<div id="content">
                <div id="leftcol">
                  <p>ssdsdsdf</p>
                  <p>sdf</p>
                  <p>ds</p>
                  <p> </p>
                </div>
                <div id="rightcol">
                  <p>sdsddsf</p>
                  <p> </p>
                  <p> </p>
                </div>
    </div>
    
    <div id="footer">sdsd</div>

</div>

 

CSS

<style type="text/css">

	body {
		margin:0;
		}

	#container {
		width:600px;
		height:auto;
		position:relative;
		margin-right: auto;
		margin-left: auto;
		}

	#header {
height:157px;
background-color: #0000CC;
		}

		#topbar {
		height:25px;
		}

	#leftcol {
float:left;
background-color:#CC0000;
height:auto;
width: 412px;
		}
#content {
height: auto;
width: 100%;
}

	#rightcol {
float:right;
width:188px;
height:auto;
background-color: #CCFF99;
		}

	#footer {
background-color: #99CC00;
width: 600px;
left: 0px;
top: 329px;
	}

</style>

[liamloveslearning]

nevermind, i floated my content div left and footer right, thanks guys