Hallo.
Ich arbeite gerade an einem Projekt, bei dem es nötig ist, zwei gleich große <div> übereinaner zu platzieren.
Klar, das geht mit einer Angabe zu
position:absolute;
top:0;
left:0;
und z-index:1;.
Zuerst baue ich einen <div> als Container. Dieser soll bestimmt werden von der Größe des <div>s mit Inhalt. Schematisch sieht das dann so aus:
<div id="container">
<div id="Inhalt">blubb</div>
<div id="darüber legen">bla</div>
</div>
Als Breite gebe ich für #Inhalt
width: 100%; an.
#Inhalt erhält nun beliebigen Inhalt (dynamisch, via php). Er ändert dabei natürlich seine Höhe.
Der zweite, leere <div> soll sich ebenso groß darüber legen:
position: absolute;
z-index:2;
top:0;
left:0;
Für die Größe gebe ich width:100%; height: 100%; an, und hoffe, dass er sich an der GRöße seines Elternelements misst.
Tja, tut er aber nicht.
Wie bring ich "darüber legen" dazu, gierig zu sein und allen verfügbaren Platz einzunehmen?
mfg, Marc