Footer am unteren Browserrand positionieren: Unterschied zwischen den Versionen

Aus Contao Community Documentation

(Die Seite wurde neu angelegt: „Oftmals muss der Footer immer am unteren Rand des Browsers stehen, unabhängig von der höhe der Seite. Mit dem Contao-Framework geht das recht einfach. Diese CSS…“)
 
(kein Unterschied)

Version vom 22. September 2011, 14:04 Uhr

Oftmals muss der Footer immer am unteren Rand des Browsers stehen, unabhängig von der höhe der Seite. Mit dem Contao-Framework geht das recht einfach. Diese CSS-Anweisungen reichen dafür aus.

Zur demonstration sind der Header, Footer und der Container eingefärbt.

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
}
 
/* LAYOUT */
 
#wrapper {
    min-height: 100%;
    position: relative;
}
 
#header {
    height: 175px;
    background: red;
}
 
#container {
    width: 980px;
    margin: 0 auto;
    background: blue;
    padding-bottom: 335px;
}
 
#footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 355px;
    background: green;
}
Ansichten
Meine Werkzeuge

Contao Community Documentation

irgendwie ist das Leben nicht fair...ich mache eine Webseite über Toilettenreinigung und Martin stellt Fotos für eine Schönheitswebseite frei...

Leo Unglaub
Navigation
Verstehen
Verwenden
Entwickeln
Verschiedenes
Werkzeuge