steffen: Höhenproblem

Hi Forumleser,

ich möchte gerne ein DIV bereich haben, dass die ganze Seite (100%) abdeckt, aber auch nachdem mehr als die komplette Seite beschrieben ist, soll der div bereich weitergehen.

Derzeit habe ich das so:

<div style="height: 100%; background-image:url(background6.gif); background-repeat:no-repeat; background-position:right bottom; background-color:white;">

</div>

Wenn nun der Inhalt mehr als die 100% bedeckt, wird der Inhalt weitergeführt, aber das Bild hängt leider noch bei 100%

Kann mir jemand helfen?

  1. hi,

    Wenn nun der Inhalt mehr als die 100% bedeckt, wird der Inhalt weitergeführt, aber das Bild hängt leider noch bei 100%

    Du möchtest keine absolute Höhe, sondern eine Mindesthöhe.
    Und ggf. einen Workaround für den IE < 7, der die passende Eigenschaft min-height nicht versteht, dafür aber height fälschlicherweise so interpretiert.
    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. Hi wahsaga,

      min-height ist genau was ich gesucht habe! Jedoch gibts damit nun auch ein kleines Problem:

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
      <html>
      <head>
       <title></title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
      </head>
      <body style="position:absolute; min-height: 100%; border:solid 1px blue; background-image:url(background6.gif);
      background-repeat:no-repeat; background-position:right bottom; background-color:white">
      Fasse dich kurz!
      </body>
      </html>

      Die min-height: 100% funktioniert nur mit position:absolute , aber dadurch wird mir der hintergrund nicht mehr angezeigt.

      Wo liegt der Fehler?

      1. hi,

        Die min-height: 100% funktioniert nur mit position:absolute , aber dadurch wird mir der hintergrund nicht mehr angezeigt.

        Wo liegt der Fehler?

        Vermutlich darin, dass du die Höhe des Elementes, auf das sich min-height prozentual beziehen soll, nicht angegeben hast - html.

        Und durch den unvollständigen Doctype schickst du den IE in den Quirks Mode, auch das solltest du abstellen.

        gruß,
        wahsaga

        --
        /voodoo.css:
        #GeorgeWBush { position:absolute; bottom:-6ft; }