Hallo Leute,
und zwar habe ich das Problem, dass ich gerne ein 3-spaltiges Div-Layout aufbauen möchte, wo es oben einen Header gibt, darunter 3 nebeneinander liegende Divs (Menü links, Content, Menü rechts) und darunter einen Footer.
Das ganze habe ich wie folgt aufgebaut:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>test</title>
<style type="text/css">
.left{
border:1px solid orange;
text-align:center;
width:200px;
height:100%;
float:left;
}
.right{
border:1px solid red;
text-align:center;
width:200px;
height:100%;
float:right;
}
.middle{
border:1px solid blue;
text-align:center;
float:left;
width:550px;
height:100%;
}
.clear{ clear:both; }
</style>
</head>
<body>
<div id="rootDiv" style="width:990px;">
<div id="header" style="border:1px solid brown; text-align:center; width:100%;">Bild</div>
<div id="inhalt" style="height:200px;">
<div class="left">Links</div>
<div class="middle">Mitte</div>
<div class="right">Rechts</div>
<div class="clear"></div>
</div>
<div id="footer" style="border:1px solid grey; text-align:center; width:100%;">Footer</div>
</div>
</body>
</html>
Aber das funktioniert irgendwie nicht richtig. :(
1.) Wie bekomme ich das mittlere Div dazu, dass es sich an die Breite bis zum rechten Menü anpasst ?
2.) Wie kann ich es bewerkstelligen, dass sich die 3 inneren Divs immer gegenseitig an die Höhe anpassen ? Also wenn im mittleren Div viel Text steht, dann sollen sich die beiden Menüs auch an dessen Höhe orientieren und umgekehrt natürlich auch, wobei diese 3 inneren Divs auch eine Mindesthöhe besitzen sollten. Darüber hinaus soll dann die Länge des längsten Textes entscheiden wie hoch die drei Divs zu sein haben. Geht sowas ?
Vielen Dank für eure Hilfe.