Sticky Footer (CSS)

Bei Seiten mit weniger Inhalt, als Platz da ist einfach den Footer an die untere Browserkante ‚kleben‘ – also einen sogn. Sticky Footer per CSS im Stylesheet einbauen.

Sticky Footer

/* -- sticky footer -- */

html, body {
height: 100%;
}

body {
display: flex;
flex-direction: column;
}

.site {
flex: 1 0 auto;
/* overflow-x: hidden; */
}

.site-footer {
flex-shrink: 0;
}

Hier der Sticky-Footer.Code, der in den meisten WordPress-Themes funktioniert und vor allem auch mit dem Starter-Theme underscore _s kompatibel ist:

.site {
display: flex;
flex-direction: column;
}

.site-main {
min-height: calc( 100vh - 5.9rem );
}