Il div mi va sotto l'altro div!!!

[drblis]

Ciao ragazzi ho adottato nel mio sito un layout liquido a 2 colonne. tutto bene fin qui ma quando la colonna di destra diventa più lunga di quella di sinistra, automaticamente il contenuto va sotto appunto la colonna sinistra che però contiene un menu e non sta bene...come faccio? vi posto il css.

html,body{margin:0;padding:0}
body{font: 100.01% Verdana,Arial,sans-serif}
h1,h2,h3{font-family: "Trebuchet MS",Arial,sans-serif;margin: 0}
h1{color: #FFA54C;font-size: 200%}
h2{color: #999;font-size: 180%}
h3{color: #666;font-size: 150%}
p{margin: 0 0 0.8em 0}

div#container{
	min-width: 1024px;
	background: url(images/imm.jpg) repeat-y 20% 0
}

div#header{
	height:200px;
	line-height: 70px;
	padding: 0 2%;
	background: #fff url(images/banner.png) repeat-x bottom
}



div#sidebar{
	float: left;
    width:20%;
	\width:20%;
	w\idth:20%; /*box model hack semplificato*/
    padding: 0 1%;
	color: #333;
	font-size:80%
}

div#sidebar2{
	float: left;
    width:29%;
	\width:33%;
	w\idth:29%; /*box model hack semplificato*/
    padding: 0 2%;
	color: #333;
	font-size:80%
}


div#content{

	position: relative;
	margin: 0 2% 0 23%
display:block;
}

div#content p{line-height:1.3}

div#footer{clear:left; background: #fff url(footer.jpg) repeat-x top}
div#footer p{margin: 0;padding: 10px 0;text-align: center;font-size: 75%}


body{font: 12pt Arial,sans-serif}
h1,h2,h3{font-family: "Trebuchet MS",Arial,sans-serif}
h1{font-size: 160%}
h2{font-size: 140%}
h3{font-size: 120%}
p{line-height: 1.2}
div#header{border-bottom: 1px solid #000}

div#footer{border-top: 1px solid #000;font-size: 80%}

#usuario{
display:block;
  position:relative;
  width:228px;
  margin-left:30px;
  height:400px;
  background-image:url(images/menau.png);
  margin-top:15px;  
  float:left;
     background-repeat: no-repeat;
     background-position: bottom left;
     margin: 10px auto;

}
div.clearer{clear: left}

Grazie anticipatamente!!


Ciaoooo:book: