Problem mit dreispaltigem Layout
qotsa
- css
0 Ingo Turski0 qotsa0 Ingo Turski0 qotsa
Hallo,
ich habe mir mit CSS ein dreispaltiges Layout gebastelt. Mein Stylsheet sieht folgendermaßen aus:
html, body
{
height: 100%;
margin: 0;
padding: 0;
background-color:#FF0000;
}
#left
{
width:150px;
height:100%;
position:absolute;
top:0px;
left:0px;
margin:0px;
background-color:#0000FF;
}
#right
{
width:150px;
height:100%;
position:absolute;
top:0px;
right:0px;
margin:0px;
background-color:#0000FF;
}
#content
{
margin-left:150px;
margin-right:150px;
background-color:#FF0000;
padding:10px;
}
Wenn das Browserfenster groß genug ist, funktioniert es in allen Browsern, auch den älteren, ganz gut. Nur wenn ich das Browserfenster vertikal so verkleinere, dass der Inhalt nicht mehr Platz hat und man scrollen muss, werden die zwei äußeren Spalten unten abgeschnitten:
http://img169.imagevenue.com/img.php?image=39302_css_122_445lo.JPG
Vielen Dank im Voraus
mfg
Hi,
Nur wenn ich das Browserfenster vertikal so verkleinere, dass der Inhalt nicht mehr Platz hat und man scrollen muss, werden die zwei äußeren Spalten unten abgeschnitten:
das hast Du mit height:100% doch so angegeben.
wenn Du eine Mindesthöhe willst, dann gebe diese an; sogar der IE7 hat das dazugelernt.
freundliche Grüße
Ingo
Aber 100 % sollte doch heißen, dass die Spalten über die gesamte verfügbare Höhe gehen. Und ich will ja keine Mindesthöhe, sondern dass sich alle Spalte, je nach Höhe des Browserfensters anpassen. Übrigens, wenn ich der mittlere Spalte eine Höhe von 100 % gebe, verändert sich diese nicht, deshalb habe ich auch dem Body die gleiche Hintergrundfarbe wie der mittleren Spalte gegeben.
Es muss doch irgendwie möglich sein, drei Spalten zu haben, die alle über die gesamte verfügbare Höhe gehen, ohne dass irgendwas unten abgeschnitten wird.
mfg
Hi,
Aber 100 % sollte doch heißen, dass die Spalten über die gesamte verfügbare Höhe gehen.
tun sie auch - aber über die des Fensters.
Und ich will ja keine Mindesthöhe
doch - mindestens 100% der Fensterhöhe.
freundliche Grüße
Ingo
Hi,
Danke für deine Antowrt, aber sieh dir doch das Bild noch mal genau an:
http://img169.imagevenue.com/img.php?image=39302_css_122_445lo.JPG
Die linke und die rechte Spalte gehen eben nicht über hundert Prozent des Fensters, wenn ich das Browserfenster verkleinere. Sie werden einfach unten abgeschnitten. Verstehst du, was ich meine?
mfg
Hi,
Die linke und die rechte Spalte gehen eben nicht über hundert Prozent des Fensters, wenn ich das Browserfenster verkleinere.
doch, gehen sie schon. Selbst anhand Deines Screenshots kann man am Scrollbalken erkennen, dass die Höhe der blauen Boxen in etwa der Fensterhöhe entspricht. Und falls du das immer noch nicht verstehst: Deine Fensterhöhe ist ca. 490px, der angezeigte Teil der blauen Boxen hat ca. 370px Höhe und der nicht angezeigte Teil dürfte dann dem Scrollbalken zu urteilen nach 120px haben.
freundliche Grüße
Ingo