min-height problem with firefox

[Zahak]

I want a site the expands when more text is put into it. Therefor I choosed to define height by min-height, to get a minimum height, and when the information in the element expands beyond min-height the element should get larger to (not just putting the information outside the box...).

#main_outer{width: 800px;min-height: 421px;background-image: url(../images/top.jpg);background-repeat: no-repeat;margin-top: 0px;margin-bottom: 0px;margin-left: 0px;margin-right: 0px;}#main_left{width: 270px;min-height: 391px;float: left;margin-top: 30px;margin-bottom: 0px;margin-left: 15px;margin-right: 0px;text-align: left;}#bottom{width: 800px;height: 53px;background-image: url(../images/bottom.jpg);margin-top: 0px;margin-bottom: 0px;margin-left: 0px;margin-right: 0px;}

The idea was, when the text in main_left becomes larger than 391px the element should expand to whatever size the text takes. That works fine, but, main_left is inside main_outer and bottom is placed below main_outer. When main_left grows bigger so should main_outer do, to push down bottom.

								<div id="main_outer">					 			<div id="main_left">								</div>					 </div>					 					 <div id="bottom">					 </div>

However, this doesnt work in firefox. When the information in main_left gets to big, main_left expands, but main_outer does not. Therefor bottom gets in the middle of the text and it look like crap.It works fine in ie thoe... but that could be a bug in ie as well (or a "feature" as some prefere to say ).Anyone got any idea how to solve this?Aaaa, sorry, problem solved missed a "Clear: left;"