Hallo.
Ich versuche in einen Container, der sich über 100% der Seitenhöhe erstreckt einen header zu plazieren. Leider wird dann die Seite länger als 100% (Scrollbalken, um so viel, wie der header hoch ist).
In anderen Threads habe ich die Lösung gelesen, den header absolut zu positionieren und dann die Abstände zu vergrössern. Das habe ich mit padding und margin probiert, trotzdem wurde die Seite immer länger...
Unten mein Code (ohne absolut-positionier-Versuche).
Ich wäre sehr froh um Hinweise, wie ich das Problem lösen könnte.
(content und navigation müssen ebenfalls 100% sein)
Danke und Gruss
Adriana
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" >
<head>
<style type="text/css">
html{height:100%; background-color:#0000ff;}
body{background-color:rgb(0, 63, 104);
margin:0px;
padding:0px;
height:100%}
#container{
background-color:#ddeeff;
height:100%;
}
#header{
height:100px;
background-color:#ff0000;
}
#navigation{
height:100%;
width:150px;
float:left;
background-color:#ffff00;
}
#content{
margin-left:150px;
background-color:#ffffff;
height:100%;
}
</style>
</head>
<body >
<div id="container">
<div id="header"></div>
<div id="navigation">
<ul>
<li>menu1</li>
<li>menu2></li>
</ul>
</div>
<div id="content">
hier ist der Inhalt
</div>
</div>
</body>
</html>