Footer div is slipping under my content div

[uknowho008]

hi, i converted my site from tables to divs a while back which was a mojor headache. but it has worked fine since. until now. i am trying to add a footer about the same size and style as my header. in source i placed the div right after the sidebar div within my container div. and in css i added width of 100% and height of 50px as well as a background color. i tried a bunch of different things but cant figure out how to keep the content div from over lapping. i would also like the sidebar to continue to the bottom of the page. when i first set up the site with divs i placed the sidebar after content in source so content would load before the sidebar which might have been a bad idea. i dont know. anyway, help would be greatly appriciated. i am also open to different design routes to get the same layout. thanks

 

here is the site http://korruptindustries.com/korruptb4/home/index.php

here is the style sheet http://korruptindustries.com/korruptb4/includes/css/korrupt.css

 

there is another style sheet for the header but i didnt think that was necessary im sure you can figure out how to get it if you need to

 

also i didnt upload the page with the footer div as i didnt want the site to be messed up. thanks again.

[sKunKbad]

If you want a footer, you will need to insert it after the SideBar div. You might try inserting a div between the two, with clear:both; width:100%. As for the SideBar div extending to 100% height. You should just make a background image, and repeat it in the Y direction. If you are pulling in all the content dynamically, you are probably looking at a much cleaner source code than I am, but your basic page structure would be as follows:

 

          <div class="Container">
               <div class="UniversalHeader">
                 
               </div>
               <div class="NavBar">

               </div>
               <div class="UnderNav">
		   
       </div>
               <div class="Content">
               
               </div>
               <div class="SideBar">
               
               </div>
               <div style="float:left; width:100%; clear:both"></div>
               <div id="footer">

               </div>
          </div>

[uknowho008]

Thanks but that didnt work. the footer div sits right under the SideNav and underneath the content div.