qotsa: Problem mit dreispaltigem Layout

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

  1. 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

    1. 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

      1. 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

        1. 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

          1. 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