Umschließenedes DIV-Element verweigert Höhe

[Fragenfrager]

Hallo liebes Forum,
das folgende Problem tritt _nicht beim IE, sondern nur beim Firefox und Opera auf.

Ich habe folgende Code-Struktur (verkürzt):
<div id="maindiv">
    <div id="navi_left">
    </div> <!-- navi_left -->
    <div id='content'>
   </div> <!-- Ende div content -->
</div> <!-- Ende maindiv -->

Das DIV "maindiv" umgibt die beiden anderen und soll dementsprechned aus optischen Gründen höher als die beiden anderen sein. Der Inhalt des DIVs "content" ist dynamisch erstllt und variiert, daher kann ich "maindiv" auch keine feste Höhe zuweisen. Ich lasse im css die height-Angabe daher weg, so dass "Auto" verwendet werden müsste. Trotzdem wird mir das "maindiv" nur als Einzeiler dargestellt.  Hier noch die CSS zu den einzelnen DIVs.
Wo liegt mein Fehler?

#maindiv
{
    border-color:#000000;
    border-style: solid;
    border-width: 1px;
    background-color:#c0c0c0;
    width:95%;
    height:auto;
    padding:10px ;
    position:realtive;
    margin: 0px auto 0;
    text-align: left;
 }

#navi_left
{
     border-color:#000000;
     border-style: solid;
     border-width: 1px;
     background-color:#ffffff;
     width:17%;
     height:80%;
     padding:0px 10px;
     position:relative;
     margin: 10px auto 0;
     text-align: left;
     float:left;
 }

#content
{
     border-color:#000000;
     border-style: solid;
     border-width: 1px;
     background-color:#ffffff;
     width:75%;
     height:80%;
     padding:10px 10px;
     position:relative;
     margin: 10px auto 0;
     text-align: center;
     float:right;
 }

Vielen Dank für die Hilfe.