I need to design a layout like this. http://img714.imageshack.us/img714/9859/layouts.png

The top bar and footer are ok but i am having troubles with main content.
Menu and header are also fine in big resolutions. If i resize the window,the content will push the sidebar to bottom. Also having troubles to put the main content into the container. If it is too big it is also pushes to bottom.

Here is my last code.
I have made a lot of expierences so it will probably have lots of things wrong.

Code HTML:
!-- Main Container -->
      <div id="page_wrapper">
 
          <!-- Top Bar -->
          <div id="top_bar">
              <div id="info_bar">
              </div>
 
              <div id="user_info">
                  <ul>
                      <li></li>
                      <li></li>
                      <li></li>
                  </ul>
              </div>
          </div>
 
          <!-- Content wrapper -->
          <div id="inside">
             <div id="main_content">
                <div id="header">
                  <div id="logo">Logo</div>
                </div>
 
                <div id="main_menu">
                  <ul>
                      ...
                  </ul>
                </div>
 
                 <div id="content">
                    <div id="left_bar">Left bar</div>
                    <div id="content_main">Content</div>
                 </div>
            </div>
 
            <div id="sidebar">
 
            </div>
 
              <div class="clear"></div>
          </div>
 
          <!-- End content wrapper -->
 
 
          <!-- Footer -->
          <div id="footer">
              <div id="footer_links">
                <ul>
                  ...
                </ul>
              </div>
          </div>
      </div>
  </body>
</html>


Important css
Code CSS:
 
#page_wrapper {width: 100&#37;;}
 
#page_wrapper #inside
{
  //Paddings and margins - not set by now.
}
 
#top_bar
{
    background-color: #bfbfbf;
    width: 100%;
    height: 40px;
}
 
#main_content
{
    float:left;  
    min-height: 600px;
    height:auto !important;
    height: 600px;
}
    #header
    {
      margin-top: 15px;
      height: 100px;
      padding-bottom: 5px;
    }
        #header #logo
        {
            margin-left: 40px;
            width: 330px;
            height: 100px;
        }
   #main_menu
   {
      border-bottom: 2px solid #ffc000;
   }
        #main_menu li
        {
            background-color: #d9d9d9;
            font-weight:bolder;
            text-align: center;
            width: 120px;
            height: 32px;
            display:inline-block;
            padding-right: 5px;
            -moz-border-radius: 7px 7px 0px 0px;
            -webkit-border-radius: 7px 7px 0px 0px;
        }
 
 
    #content #left_bar
     {
        border-right: 2px solid orange;
        width: 180px;
        float:left;
        min-height: 600px;
        height:auto !important;
        height: 600px;
     }
 
     #content #content_main
     {        
        float:right;
        min-height: 600px;
        height:auto !important;
        height: 600px;
     }
 
#sidebar
{
    background-color: #FFF;
    border-left: 1px #d9d9da solid;
    width:180px;
    min-height: 600px;
    height:auto !important;
    height: 600px;
    float:right;
    display: inline;
    padding-left: 10px;
}
 
#footer
{
   background-color: #7f7f7f;
   font-size: 10px;
   color:#4d4047;
   width: 100%;
   height: 35px;
 
}