killy
Threadersteller
Dabei seit: 03.08.2006
Ort: HH
Alter: -
Geschlecht:
|
Verfasst Mo 14.07.2008 16:46
Titel kurze div frage zum aufbau |
|
|
moin,
ich benötige folgendes konstrukt.
ein div mit fester höhe für die navigation.
ein weiteres div für den inhalt, der direkt darunter andockt und eine höhe
von 100% aufweisen soll.
mein coding ist mal mit dabei.
wie man hier sieht fliegt genau der bereich aus dem div, der die höhe des
ersten div erhält.
hat da jemand ne idee? danke für die hilfe!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div id="outer"><!--outer rahmen zum setzen gedacht-->
<div id="inner_top">text oben und so alles<br />
zweite zeile und nix bricht aus dem rahmen...<br />
<select name="top5" size="1">
<option>Heino</option>
<option>Michael Jackson</option>
<option>Tom Waits</option>
<option>Nina Hagen</option>
<option>Marianne Rosenberg</option>
</select>
</div>
<div id="inner_bottom">der untere text text text text<br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
text text text text text text <br />
</div>
</div>
</body>
</html>
<style>
html {
height: 100%;
}
body {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
}
#outer {
width: 300px;
height: 100%;
border: 2px solid red;
position: relative;
}
#inner_top {
width: 100%;
height: 50px;
border: 1px solid black;
position: relative;
}
#inner_bottom {
width: 100%;
height: 100%;
border: 1px solid green;
position: relative;
overflow: auto;
}
</style>
|
|