verschachtelte divs...

[selma]

hallo!

also ich habe folgendes problem: ich erstelle eine webseite nun auf reiner css basis. nun spielt mozilla nicht mit, und ich weiß nicht, was los ist.

nun denn, ich habe ein div, welches #frame heißt, dann eines das heißt #picture und dann noch eines, das heißt #right. die verschachtelung sieht nun folgendermaßen aus:

<div id="frame">
 <div id="picture">
  <!-- bild -->
 </div>
 <div id="right">
  <!-- sub navi -->
 </div>
</div>

ansich glaub ich, ist da noch nichts falsch. nun das eigentliche problem:

die einzelnen css- angaben dazu sehen so aus:

#frame {
margin-left:auto;
margin-right:auto;
margin-top:2em;
width:46em;
z-index:1;
border-style:solid;
border-width:1px;
border-color:#000000;
}
#right {
margin-top:3em;
margin-left:1em;
margin-left:1em;
padding-left:0.5em;
padding-right:0.5em;
height:10em;
z-index:1;
float:left;
width:8em;
border-style:solid;
border-width:1px;
border-color:E4E4E4;
}
#picture {
margin-top:1em;
margin-bottom:1em;
margin-left:1em;
width:33em;
left:1em;
height:7em;
z-index:1;
float:left;
border-style:solid;
border-width:1px;
border-color:#E4E4E4;
}

komischerweise macht mozilla dann kein frame mehr. soll heißen, der container #frame ist dann nur mehr ca. 1px hoch. was kann ich machen, dass nun der rahmen von #frame erhalten bleibt? mit einer bestimmten (absoluten) höhe ist es nicht unbedingt sinnvoll, da ich alles noch mit inhalten füllen werde bzw. muss sich der rahmen ausdehnen (können). und ich möchte ihm nicht auf jeder seite ein neues 'height' attribut geben.

ich hoffe, ihr versteht, was ich meine.
was kann ich dagegen tun, dass das frame wieder 'groß' wird?

mlg
selma

p.s. danke für eure antworten im voraus