Firefox-Problem mit DIV in DIV

[HP-Bauer]

Hallo,

im IE wird das nachfolgende CSS korrekt angezeigt, aber in Firefox wird das inliegende DIV "oben-intern" nicht angezeigt. Warum?

html, body {
height:96%;
padding:1%;
background:#000000;
}
#oben {
position:relative;
min-height:10%;
height:auto !important;
height:10%;
width:100%;
text-align:center;
background:#0033ff;
}
#oben-intern {
position:relative;
top:25%;
min-height:50%;
height:auto !important;
height:50%;
background:#ff99ff;
}
#mitte {
position:relative;
min-height:64%;
height:auto !important;
height:68%;
width:100%;
background:#226699;
}
#unten {
position:relative;
min-height:20%;
height:auto !important;
height:20%;
width:100%;
background:#330077;
}

Farben sind zufällig gewählt. ;-)

HTML:

<div id="oben">
<div id="oben-intern"></div>
</div>
<div id="mitte"></div>
<div id="unten"></div>

MfG
HP-Bauer

[HP-Bauer]

Bitte helft mir!

MfG
HP-Bauer

[D.R.]

Hi,

verwende mal das:

#oben {
position:relative;
height:10%;
width:100%;
text-align:center;
background:#0033ff;
}

für #oben.

Ich verstehe nicht, warum du überhaupt 2 height-Angaben verwendest!

Einen schönen Freitag noch!

[HP-Bauer]

Hallo.

Ich verstehe nicht, warum du überhaupt 2 height-Angaben verwendest!

Da die Höhe mindestens 10% sein soll, aber das DIV bei größerem Inhalt mitwachsen soll. Wenn dies im IE und Mozilla funktionieren soll, ist dieser Hack m. W. notwendig.

MfG
HP-Bauer