Servus,
ich hab ein Problem ich möchte gerne ein Container-Div mit einer festen Breite und variablen Höhe haben für einen Hauptbereich mit 3 Spalten, die 2 Spalten links sind mit float:left definiert die rechte mit float:right.
Werden aber innerhalb des mittleren Divs weitere Divs definiert gehen diese über die mittlere Spalte bzw. über das komplette Container-Div hinaus (Was bei normalen Text allerdings auch passiert) lässt sich das irgendwie so hinkriegen das alles in der Höhe mitwächst?
Wo liegt da mein Problem?
PHP-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type" />
<title>Div Problem</title>
<style type="text/css">
<!--
* {
font-family: Times, sans-serif;
font-size: 14px;
margin: 0;
padding: 0;
}
body {
font-family: Times, sans-serif;
font-size: 14px;
padding: 10px;
margin: 0;
}
div.page {
margin-left: auto;
margin-right: auto;
border: 1px solid black;
width: 900px;
height: 800px;
}
div.header {
height: 80px;
width: 100%;
}
dif.footer {
height: 30px;
width: 100%;
}
div.middle {
width: 100%;
height: 690px;
}
div.left_menu {
width: 190px;
height: 100%;
float: left;
}
div.main {
float: left;
height: 100%;
width: 500px;
background-color: orange;
}
div.right_menu {
width: 190px;
float: right;
height: 100%;
}
//-->
</style>
</head>
<body>
<div class="page">
<div class="header">Header</div>
<div class="middle">
<div class="left_menu">Left</div>
<div class="main">
<div style="width: 400px; height: 300px; border: 1px solid red; margin: auto;">Ein Div</div><br>
<div style="width: 400px; height: 300px; border: 1px solid red; margin: auto;">Ein Div</div><br>
<div style="width: 400px; height: 300px; border: 1px solid red; margin: auto;">Ein Div</div><br>
</div>
<div class="right_menu">Right</div>
</div>
<div class="footer">Footer</div>
</div>
</body></html>
ps: Bei den Problemen die bei Divs auftreten kann ich einerseits verstehen warum Table-Layouts immer noch sehr beliebt sind.