Inhalt läuft zur Seite raus - Höhe anpassen

[MasteR ChieF]

Hallo Zusammen

Ich habe das Problem schon gegoogelt, aber nicht genau das gefunden, was ich suche.

Ich generiere meine Seite voll und ganz dynamisch. Schlussendlich sieht die Struktur folgendermassen aus:

<div id="content">
    <div id="iDiv"></div>
    <div id="cDiv"></div>
    <div id="mDiv"></div>
</div>

Die 3 Div-Elemente innerhalb des content-Div's sind alle mit position:absolute positioniert und das content-Div mit position:relative.
Ebenfalls sind die 3 Div-Elemente innerhalb des content-Div's mit einem z-Index versehen. Das heisst sie sind alle übereinander.

In den Divs befinden sich diverse Inhalt wie auch ein Bild. Wenn das Bild nun grösser wird als der Content angegeben (min-height: 400px ). Läuft das Bild unten über den Seitenbereich.

Was kann ich dagegen tun? Gibt es per CSS eine Möglichkeit, dies zu unterbinden??

Danke und Gruss
Master Chief

 

[prm]

absolut positionierte Elemente führen ein eigenständiges Dasein "außerhalob vom Fluss".
Verzichte deshalb auf die absolute Positionierung, positioniere besser mit float und margin und dein Problem sollte keines mehr sein.

 

[MasteR ChieF]

Danke für deine Antwort.

Das heisst, ich soll meine 3 Divs mit float und Margin - Angaben übereinander positionieren?? Brauche ich dann den z-Index noch?

 

[prm]

z-index ist nur in Verbindung mit position wirksam.
Es kommt aber auf deine Gesamtkonstruktion drauf an.
Deshalb wäre ein Link zur Problemseite sicherlich hilfreich, damit man alles komplett im Zusammenhang sieht.

 

[MasteR ChieF]

Die Seite ist nicht online.. bzw nicht öffentlich. Kann sie auch nicht öffentlich stellen, weil sie sensible Daten beinhaltet.

Aber nur mal grundsätzlich: ist es möglich, mehrere Divs übereinander zu legen, ohne einen Z-Index zu vergeben??

 

[threadi]

Meinst Du mit Übereinander wirklich übereinander oder sollten die Elemente nebeneinander liegen, nur eben eins an dem anderen? Momentan tippe ich auf letzteres, denn sonst würdest Du so eine Frage nicht stellen glaube ich?!

 

[MasteR ChieF]

Nein, sie müssen effektiv übereinander sein.
Alle 3 Elemente haben genau die gleichen Dimensionen (Breite, Höhe). Und mit Position Absolute und Z Index hat das wundervoll funktioniert... nur eben mit dem Nebeneffekt, dass wen der Inhalt zu gross ist, dieser über das Design läuft...

 

[threadi]

Dann muss man deine Frage

Aber nur mal grundsätzlich: ist es möglich, mehrere Divs übereinander zu legen, ohne einen Z-Index zu vergeben??

mit Ja beantworten, deinen Beitrag danach mit einem ABER versehen: so übereinander gelegte Elemente sind unabhängig voneinander. D.h. wenn der Inhalt im obersten Element dieses vergrößert, wird das darunterliegende nicht mit vergrößert. Es geht also nicht.

 

[MasteR ChieF]

Ja, das ist mir föllig klar. Die grösse der 3 übereinanderliegenden Elemente ist auch nicht das Problem. Die sind immer gleich gross.
Das Problem ist, dass wenn sie zu gross werden, sie über die Seite hinauslaufen...

Sorry, hätte nicht gedacht, dass es so kompliziert ist =)

 

[MasteR ChieF]

Zur Info: Ich habe eine andere Lösung gefunden.
Ich schaue einfach, dass alle Bilder eine Maximale Grösse haben, wenn ich den Inhalt dynamisch aufbereite. So funktioniert das auch.

Danke trozdem für die Hilfe =)