CSS: Højden auto fungerer i IE 7.0, men ikke i Mozilla Firefox?

Godmorgen de herre..

Jeg har efter lang tid endelig ladet mig overbevise til at begynde at bygge hjemmesider op i divs frem for de gode gamle tabels, da jeg godt selv kan se fordelen heri. Dette har dog medført et par problemer, da jeg jo som sagt er ny på det punkt =)

På en ny side har jeg sat højden til content (altså hovedindholdet) til auto, således den selv definerer højden ud fra hvor meget tekst/billeder der er. Dette virker også nogenlunde efter hensigten i Internet Explorer 7.0, men dette er desværre ikke tilfældet i Mozilla Firefox.

Det ser ud som det skal her i IE7.0:
http://img88.imageshack.us/img88/8496/explorerrp1.jpg

Og sådan her ser det desværre ud i Mozilla Firefox:
http://img88.imageshack.us/img88/8305/mozillaut5.jpg

Den udvider altså ikke content som den skal, men flytter i stedet bunden helt op.

I min stylesheet har jeg blot defineret content div'sne som følgende:

#content{
    width: 667px;
    height: auto;
    background-color:#FFFFFF;
    margin-left: 21px;
    margin-right: auto;
    padding-top: 0px;
    padding-left: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
}

#contentmain{
    width: 417px;
    height: 600px;
    background-image: url(images/content_main_bg.png);
    margin-left: 12px;
    margin-right: auto;
    padding-top: 0px;
    padding-left: 0px;
    padding-bottom: 0px;
    padding-right: 0px;
    float: left;
}

Hvordan løser jeg dette problem :/ ?

Hvis i skal bruge mere af koden siger i bare til. Jeg ville blot ikke spamme eksperten med hele min stylesheet + kode til hjemmesiden, hvis det ikke var nødvendigt :)