Float non rimane racchiuso nel div container

[Alejandro]

Ragazzi forse è un problema classico ma non ho ancora trovato la soluzione in giro per il web.
Ho un problema di visualizzazione del container SOLO con FF (con ie si vede tutto bene).

Ho questo css:

.container {
    width: 1000px;
	height:auto;
	margin: 0 auto;
	background:transparent url(../img/bg_transparency_ffffff.png) repeat scroll 0 0;
}

.topsection1{
width: 1000px;
height:auto;
margin:0 0 5px 0; 
}

.topsection2{
 width: 980px;
 height:auto;
 margin:0px 10px 10px 10px;
 border: 1px solid #cccccc; 
}

.leftcolumn{
	float:left;
	clear: left;
	margin:0 0 0 10px;
	width:360px;
	height:auto;
}

.centercolumn{
	float:left;
	display:inline;
	margin:0 0 0 10px;
	width:300px;
	height:auto;
}


.rightcolumn{
	float:right;
	margin:0 10px 0 10px;
	width:300px;
	height:auto;
}

e questo html:

<div class="container">		
	<div class="topsection1">menu...</div>
	<div class="topsection2">top bar...</div>
	<div class="leftcolumn">colonna sx...</div>
	<div class="centercolumn">colonna centro...</div>
	<div class="rightcolumn">colonna dx...</div>
</div>

Il problema è che su FF il container si blocca alla fine della topsection2 e non va "sotto" le tre colonne. Suppongo che sia dovuto al float ma non ho saputo risolverlo. Questo problema non capita su IE.