Dynamische Höhenanpassung an absolut positionierten Container

JimmyOS · #1 (**permalink**) 30.09.2008, 16:54

Hi Leute, ich habe ein kleines Layoutproblem. Ich habe zwei Container. Der äußere ist relativ positioniert und soll sich an die Höhe des internen Containers anpassen. Der innere Container ist jedoch absolut positioniert.

Zur Veranschaulichung einmal der Code:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de-DE">
<head>
</head>

<body>

<div style="border: 1px solid #000; position: relative; width: 200px;">
    <div style="position: absolute; top: 20px; left: 20px;">
    Das ist ein Test<br/>
    Das ist ein Test<br/>
    Das ist ein Test<br/>
    Das ist ein Test<br/>
    Das ist ein Test<br/>
    Das ist ein Test<br/>
    Das ist ein Test<br/>
    </div>
</div>

</body>
</html>

Screenshot der Demo Seite:
2008-09-30_165027.gif
Der Balken über der Schrift ist der äußere Container, welcher sich nicht anpassen möchte.

Dieses kleine Beispiel verdeutlicht die Situation, die sich im größeren Projektrahmen abspielt. Dummerweise habe ich keine andere Möglichkeit, als bei beiden Containern auf die demonstrierten Positionierungen zurückzugreifen. Alles andere würde wieder Probleme anderer Natur auslösen.

fricca · #2 (**permalink**) 30.09.2008, 16:57

Es geht nicht.
Es gibt bestimmt eine Weg ohne abs. Positionierung. Was willst du erreichen?

In4matiker · #3 (**permalink**) 01.10.2008, 11:11

Wenn es über nicht CSS nicht geht dann sicher mit Javascript.
Dazu müsstest Du den beiden DIV Elementen eine ID verpassen und könntest danach so zu deinem Ziel kommen:

document.getElementById('divAussen').style.height = document.getElementById('divInnen').offsetHeight + 'px';

Am besten in eine Funktion packen und wenn Sie der Inhalt des DIV's anpasst einfach neu aufrufen.

JimmyOS · #4 (**permalink**) 01.10.2008, 19:48

Danke für die Tipps! Ich denke ich werde mich für eine JS Lösung entscheiden.

mariane · #5 (**permalink**) 02.10.2008, 13:11

... und was ist bei deaktivierten JS ..., wenn das Problem anders zu lösen ist, dann würde ich mich nicht in eine JS-Abhängigkeit bringen, noch dazu wo es um das Layout geht.

heiko_rs · #6 (**permalink**) 02.10.2008, 13:13

Ich fresse eh einen Besen, wenn es nicht auch ohne abs. Pos. geht

fricca · #7 (**permalink**) 02.10.2008, 13:15

Des Menschen Wille ist sein Himmelreich.
*schulterzuck*

JimmyOS · #8 (**permalink**) 02.10.2008, 13:29

In diesem Falle ist es schwierig eine Lösung ohne absolute Positionierung zu finden, da ich in eine bestehende Umgebung eingreife und somit alle abhängigen Elemente mit anpassen müsste.
Javascript ist bei diesem Projekt kein Problem, da es für die Nutzung der Software sowieso zwingende Vorraussetzung ist.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Header mit mehreren, absolut positionierten DIVs so richtig?	quarki69	CSS	14	24.06.2008 20:54
Inman Position clearing - clearen von absolut positionierten divs	tomaso	Javascript & Ajax	3	25.01.2008 09:38
Positionierung von Container horizontal	mayhemtl	CSS	9	11.08.2007 15:25
Container nimmt nicht die Höhe seines Inhalts an	Lestat	CSS	10	04.08.2005 13:47
absolute positionierte divs in nicht absolut positionierten	cnitro	CSS	4	09.05.2005 19:19