私は働いているサイトを持っています。私は、ページの下部に貼り付けるためにフッターを取得したい。 だから私は基本的にこれをした簡単なガイドに従った:
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;
}
これは当初はうまくいくように見えました。それから、コンテンツがビューポートの高さ以上で、それが機能しなくなった段階になりました。
あなたが見るなら この フッターがページの最下部にあることがわかります。
しかし、もしあなたが見るなら この、フッターはビューポートの下部にあります。 私はこれが簡単な修正だと知っていますが、私はそれを把握できません。 誰かが私に手を差し伸べることができますか?
回答:
回答№1は2ページの下部にコンテンツがない限り、フッターをスティックしたい body
スクロールした後に表示されるのに十分な大きさですか?
もしそうなら、あなたは height: auto;
あなたのボディータグには、それ以上あれば 100%
あなたの min-height
ルールを考慮して、フッターを下に押します。
それがあなたの意図した行動であるかどうか私に教えてください。
回答№2の場合は1
変化する
position:absolute
ために .footer
に position: fixed
回答№3の場合は0
.footer {
position: static;
right: 0;
bottom: 0;
left: 0;
height: $footer-height;
}