nicht angemeldet
Hi,
folgender Html-Code zeigt den Grundaufbau meiner Seite. Oben befindet sich der div-Container "menu", der das Menü beinhaltet und insgesamt eine Höhe von 99px einnimmt. Darunter befinden sich zwei weitere div-Container "nbar" und "fxt" die nebeneinander angeordnet sind. Unabhängig von dem Inhalt dieser beiden div Container sollen sie stets bis zum Ende des Browserfensters gehen.
Das funktioniert auch, solange der Inhalt dieser div Container nicht mehr als die zur Verfügung stehende Höhe einnehmen.
* {margin: 0;padding: 0;border: 0px;}
body {
font-size: 14px;
font-family:Tahoma;
width:100%;
height:100%;
}
#wrapper
{
min-height: 100%;
height:auto !important;
height:100%;
overflow: hidden !important;
position:relative;
background:#fff;
}
.menu {
height:99px;
width:100%;
background:#eee;
}
#content {
width:100%;
height:100%;
position:fixed;
top:119px;
left:0px;
overflow-x:auto;
}
#nbar {float:left;height:100%;}
#nb_open {
width:50px;
border: 1px solid #878787;
border-left-width: 0px;
background: #dcdcdc;
height: 100%;
}
#fxt {
display:block;
margin-left:70px;
margin-right:20px;
height:100%;
background:#aaa;
}
.fxtc {padding-bottom: 20px;}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>testpage</title>
<link href="test.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
<div class="menu">
</div>
<div id="content">
<div id="nbar">
<div id="nb_open"></div>
</div>
<div id="fxt">
<div class="fxtc"></div>
<div class="fxtc" style="background:#ddd; height:1000px;"></div>
</div>
</div>
</div>
</body>
</html>
Reicht die Fenstergröße (Browser) nicht aus, um den kompletten Inhalt des "content" div Containers darzustellen, soll eine Scrollleiste beim "content" div Container erscheinen. Diese taucht auch auf. Allerdings ist es durch die Scrollleiste nicht möglich, den kompletten Inhalt des "content" div Containers zu sehen. Man sieht u.a. auch das untere Ende der Scrollbar nicht. Wie kann man das beheben? Ich denke, dass das mit der CSS-Angabe "position:fixed;" beim "content" div Container zusammenhängt.
Des Weiteren wäre es super, wenn beide div Container "nbar" und "fxt" immer - auch wenn eine Scrollleiste benötigt wird - bis zum Ende der HTML-Seite reichen würden; also bis zum unteren "Scrollpunkt". Im obigen HTML-Code ist es momentan so, dass die "nbar" leider nicht an die Höhe des "fxt" div Containers angepasst wird.
Gruß
Bernd
MudGuard