Mhh, so richtig isses nicht das wonach ich suche, habe mir mal Dein Beispiel zusammengebaut. Also wenn ich text in das gründe Feld reinschmeiße wird dieses auch größer (weil height: auto
das blaue und das rote sollen genau an dieser Position bleiben. Wenn das grüne nun in das rote ragt, soll sich das rote auch mit nach unten ausdehnen, dabei aber die Position behalten.
HTML:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>CSS Kram</title>
<link href="/Style/test.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="oben">
<div id="text">
text</p>
text</p>
text</p>
</div>
</div>
<div id="unten"></div>
</body>
</html>
CSS:
Code:
#oben {
background-color: #009999;
height: 200px;
width: 200px;
position: relative;
}
#text {
background-color: #CCFF99;
height: auto;
width: 100px;
top: 20px;
position: relative;
}
#unten {
background-color: #FF6666;
height: 50px;
width: 200px;
top: 0px;
position: relative;
}