[CSS] Content-DIV am Ende der Seite ausrichten

Dieses Thema im Forum "Webdesign" wurde erstellt von Characticl D, 15. Mai 2010 .

Schlagworte:
  1. 15. Mai 2010
    Content-DIV am Ende der Seite ausrichten

    Hi Leute, habe folgendes Problem:

    Ich habe 3 DIVs. Einen für einen Ticker oben, 100px hoch, 750px breit. Einen für den Header, 200px hoch, 750px breit. Und einen für den Inhalt, der soll keine bestimmte Höhe haben und auch 750px breit sein.

    Der DIV für den Inhalt soll bündig nach dem Header beginnen und am Ende der Seite aufhören, eigentlich wie ein Footer vom Prinzip her. Letztendlich muss er sich ja irgendwie an der Auflösung orientieren. Ich kriege das irgendwie nicht gebacken, kann mir jemand beim Positionieren dieses DIVs helfen

    Danke schonmal.
     
  2. 15. Mai 2010
    AW: Content-DIV am Ende der Seite ausrichten

    html{
    height:100%; /* WICHTIG */
    }

    body{
    width:100%;
    height:100%; /* WICHTIG */
    margin:0;
    padding:0;
    }

    #site{
    width:100%; /* IN DEINEM FALL 750PX UND EVTL margin: 0 auto; FÜR MITTIGEN DIV */
    height:100%; /* WICHTIG */
    min-height:100%; /* WICHTIG */
    height:auto !IMPORTANT; /* WICHTIG */
    position:relative; /* WICHTIG */
    }

    #foot{
    position:absolute; /* WICHTIG */
    bottom:0; /* WICHTIG */
    width:100%;
    height:100px;
    }



    dann dein html soll ungefähr so aufgebaut sein

    <body>
    <div id="site">
    <div id="head"><!-- Dein Header --></div>
    <div id="content">
    <!-- Dein Content -->
    </div>
    <div id="foot"><!-- Dein Footer kann auch leer bleiben sorgt dafür das die Seite immer bis zum unteren Browserrand geht --></div>
    </div>
    </body>



    du musst natürlich alles bisschen anpassen nach deinen wertenund deinem aufbau aber so hast du immer eine seite die 100% höhe hat egal wie man es skaliert.
    hoffe du kommst damit klar ...

    mfg
     
  3. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.