CSS für den Festen Footer
Ich habe eine ziemlich grundlegende HTML-Seite. Der code sieht wie folgt aus:
<body>
<header style="min-height: 255px;">
</header>
<article style="padding-bottom: 60px; width: 900px; margin: 0 auto;">
Body text goes here.
</article>
<footer style="position: absolute; bottom: 0px; width: 100%; height: 60px; background-color: black;">
Copyright information
</footer>
</body>
In der Regel, mein text ist ziemlich groß. Der text ist groß genug, dass eine scroll bar ist erforderlich. Es sieht aus wie der footer sitzt oben auf den text nach unten. Dann, wenn ich nach unten scrollen, wird die Fußzeile nicht fixiert bleiben. Was mache ich falsch?
Danke
nur um das Beispiel konzentriert 🙂
InformationsquelleAutor user687554 | 2012-12-09
Du musst angemeldet sein, um einen Kommentar abzugeben.
Müssen Sie
position:fixed;
in der Fußzeile:InformationsquelleAutor
Ändern
position: absolute
von der Fußzeile aufposition: fixed
.http://jsfiddle.net/SUQuX/
Warum? Dies erklärt, wie unterscheiden Sie sich https://css-tricks.com/absolute-relative-fixed-positioining-how-do-they-differ/ ich denke, in Ihrem Fall das problem ist, dass die
absolute
element ist das anbringen an den Körper, damit es scrollt mit dem Körper.InformationsquelleAutor
Verwenden
position: fixed
stattposition: absolute
.Warum? Dies erklärt, wie unterscheiden Sie sich https://css-tricks.com/absolute-relative-fixed-positioining-how-do-they-differ/ ich denke, in Ihrem Fall das problem ist, dass die absolute element ist das anbringen an den Körper, damit es scrollt mit dem Körper.
InformationsquelleAutor
Ich Schreibe diese Antwort, weil ich denke, es kann jemand helfen in der Zukunft. Ich stehe vor einem problem, selbst nach der Definition der
height
der Fußzeile undmargin-bottom
für den Körper.Das problem ist, wenn Sie responsive-website, wo Sie die Höhe der Fußzeile dynamisch ändert, basierend auf der Bildschirmgröße haben Sie die Inhalte überschneiden. Um das zu beheben, habe ich verwendet jQuery - Halten Sie jede Einstellung, die gleichen, außer für
margin-bottom
fürbody
undheight
der Fußzeile.Dieser wird immer der footer unten, auch wenn die Fußzeile Höhe änderungen und es wird keine Inhalte über Läppen.
InformationsquelleAutor