Fußzeile nicht am Ende der Seite zu bleiben

Question

Ich weiß, diese Frage vor gefragt worden, aber ich habe versucht,

footer{ 
position: absolute; 
bottom: 0; 
margin-bottom: 0; 
padding-bottom: 0; 
} 

html, body { 
min-height: 100%; 
padding: 0; 
margin: 0; 
} 

Ich habe auch versucht, eine CSS-Tricks Methode https://css-tricks.com/snippets/css/sticky-footer/

Keine dieser Optionen für mich gearbeitet hat (oder zumindest nicht für sehr großen Bildschirm). Was kann ich noch versuchen? Dank

Answer 1

Try this:

HTML

<section class="footer id="footer"> 
Content 
</section> 

CSS

#footer { 
background-color: #63C0B8; 
color: #1e1e1e; 
margin-bottom: 0px; 
} 

Das Hashtag ist WICHTIG

Beachten Sie auch, dass die Fußzeile auf der Unterseite bleiben .. Aber du musst zuerst Inhalt darüber legen.

Answer 2

Versuchen Sie folgendes:

footer{ 
position: absolute; 
bottom: 0; 
margin-bottom: 0; 
padding-bottom: 0; 
} 

html, body { 
min-height: 100%; 
padding: 0; 
margin: 0; 
position:relative; 
} 

Answer 3

Sie fehlen verschiedene Stile, die eine ‚klebrige Fußzeile‘ auf die Anwendung von wesentlicher Bedeutung sind. Dies ist, wie ich habe es immer

getan

DEMO https://jsfiddle.net/zmbh0v4z/

html { 
    position: relative; 
    min-height: 100%; 
} 
body { 
    margin: 0 0 100px; /* bottom = footer height */ 
} 
footer { 
    background: red; 
    position: absolute; 
    left: 0; 
    bottom: 0; 
    height: 100px; 
    width: 100%; 
}