Mozzila neroztahuje DIVi! :(

Neviem ako to vysvetlit tak tu hodim zdrojak ;)

<div id="main_div">
<div id="banner">
<div id="left_banner">
</div>
<div id="right_banner">
</div>
</div>
</div>

Takze situacia je nasledovna. #main_div ma height:auto; v pripade ze nastavim pre #banner height:100px tak sa main_div sa roztiahne. Potom nastavim pre #banner height: auto a pre #left_banner height:100px v mozzile sa uz tie dva nadradene DIVi neroztiahnu podla jeho velkosti cim to je? :( Vyzera to nejak takto :P
IE tak chcem aby to fungovalo ;)
http://grafika.gona.cz/ie.jpg
Mozzila a takto to vyzera v Mozzile :(
http://grafika.gona.cz/mozzila.jpg

Mimochodem...levý pravý banner, nefloatujou náhodou? Řekl bych, že ano. Pokud je to tak, tak na konec obalujících divů dej nějaký cleaner.

cleaner?co to je? :(

Pokud je to tak, tak na konec obalujících divů dej nějaký cleaner.

A obalujici div je v tomto pripade #banner?

ale mi to nefunguje :( CSS k tim DIVom mam taketo:

body
{
text-align: center;
}

*
{
margin: 0px;
padding: 0px;
}

#main_div
{
margin: 0 auto;
text-align: left;
top: 0px;
width: 1000px;
border: solid 1px black;
}

#banner
{
width: 1000px;
clear: both;
line-height: 0px;
font-size: 0px;
}

#left_banner
{
float: left;
width: 500px;
height: 100px;
border: solid 1px red;
margin: 0px;
padding: 0px;
}

#right_banner
{
float: right;
width: 490px;
height: 100px;
border: solid 1px green;
margin: 0px;
padding: 0px;
}

plavacek, plavacek, cistic?Co to ako je? :D