Warum ist die Fußzeile nicht ganz unten - html, css

Ich habe eine Website, an der ich arbeite. Ich möchte, dass die Fußzeile am Ende der Seite bleibt. Also folgte ich einem einfachen Leitfaden, der im Prinzip folgendes tat:

html {
height: 100%;
}

body {
min-height: 100%;
position: relative;
padding-bottom: $footer-height + $footer-margin-top;
}

.footer {
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: $footer-height;
}

Dies schien am Anfang zu funktionieren. Dann kam ich zu einem Stadium, in dem der Inhalt mehr als die Höhe des Betrachtungsfensters war und dann hörte es auf zu funktionieren.

Wenn du es ansiehst Dies Sie können sehen, dass sich die Fußzeile am Ende der Seite befindet.

Aber wenn du es dir ansiehst DiesDie Fußzeile befindet sich am unteren Rand des Ansichtsfensters. Ich weiß, das ist eine einfache Lösung, aber ich kann es nicht herausfinden. Kann mir bitte jemand eine Hand geben?

Antworten:

Sie möchten, dass Ihre Fußzeile am unteren Rand der Seite bleibt, sofern der Inhalt nicht aktiviert ist body ist groß genug, dass es nach dem Scrollen erscheint?

Wenn ja, sollten Sie einstellen height: auto; auf Ihrem Body-Tag, also wenn es mehr als ist 100% setz dich auf deinen min-height Regel, es berücksichtigt und schiebt die Fußzeile nach unten.

Lass mich wissen, ob das dein beabsichtigtes Verhalten ist.

Veränderung position:absolute zum .footer zu position: fixed

.footer {
position: static;
right: 0;
bottom: 0;
left: 0;
height: $footer-height;
}