Drei Divs nebeneinander gleicherer höhe

[Timo]

Hallo Leute,

folgendes Problem:

Ich möchte einfach nur drei Divs nebeneinander haben, wobei im mittleren Text stehen soll. Dieser Text soll die Höhe der Divs angeben, auch der beiden äußeren.

Ein Minimalbeispiel ist:

<div style="border:1px solid red; float:left;width:800px;">
 <div style="border:1px solid black; float:left;width:90px; height:100%;">1. Unterdiv</div>
    <div style="border:1px solid green; float:left;width:600px;">
 Hier kommt der Inhalt rein der dann auch die Höhe der beiden anderen Divs an den Seiten mit verändern soll.
    </div>
    <div style="border:1px solid blue; width:90px; float:left; height:100%;">3. Unterdiv</div>
</div>

Aber die 100%height beziehen sich jetzt auf die ganze Seite. Wenn ich im mittleren Div ein weiteres Div anlege mit 100%height, bezieht es sich auch auf die ganze Seite.

Also hat jemand eine tolle Idee?

Danke, Timo

[Professor Hase]

Hi Timo,

zunächst mal mußt Du prinzipiell beim Floaten den nachfolgenden divs ein margin-left geben - und das mit dem Wert der Breite des/der vorangegangenen divs. ( Du _mußt_ nicht, aber wenn der Inhalt im mittleren div länger ist als der im linken, dann wird genau auf der Höhe, in dem das linke div endet, der Inhalt des mittleren wieder ganz nach links wandern. Zumindest in Browsern, die CSS richtig interpretieren. )

Wenn ich im mittleren Div ein weiteres Div anlege mit 100%height, bezieht es sich auch auf die ganze Seite.

Nein. Das 100% bezieht sich auf das Elternelement, und das ist in _dem_ Fall das umgebende div.

mfG

Professor Hase