Footer am unteren Browserrand positionieren

Aus Contao Community Documentation

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.


Dieser Code ist noch nicht im Internet Explorer getestet. Wenn es funktioniert kann dieser Hinweis entfernt werden.

"Warnhinweis"


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;
}
Von „https://de.contaowiki.org/index.php?title=Footer_am_unteren_Browserrand_positionieren&oldid=4386“
Ansichten
Meine Werkzeuge

Contao Community Documentation

<user> Composer meckert bei Isotope, dass er mit tablelookupwizard 3.1 nicht zurecht kommt - korrekt?
<Toflar> keine Ahnung, sowas weiss ich doch nicht auswendig :D
<user> wer dann ;)
<Toflar> na niemand, deswegen schreibt man's ja in die composer.json

Navigation
Verstehen
Verwenden
Entwickeln
Verschiedenes
Werkzeuge