このテーマに関する多くの記事を見つけましたが、どれもうまくいきません。コンテンツが十分に大きくないときに画面の下部にあるフッターを作成したいのですが、コンテンツが画面よりも長い場合フッターがコンテンツの下にとどまり、画面の下部にくっつきません。
前もって感謝します!
これは、それを行う方法のもう1つの例であり、AFAIKのすべてのブラウザーで正常に機能します。 http://peterned.home.xs4all.nl/examples/csslayout1.html
編集:私は作者ではありません。少し前にそのようなものを探しました。
-- JavaScript で行う
- 例
<div class='content'>
your page
</div>
<div class='Footer'>Footer</div>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
var document_height = $(document).height();
var content_height = $('.content').height();
if (content_height < document_height) {
$('.content').css('height', (document_height));
}
</script>
編集: CSS Sticky Footerを試してください: これは素晴らしく、CSS のみです。
試してみたい場合は、absolute
CSS の position プロパティも機能する可能性があります。チェックアウトMDN ドキュメント:
#footer {
position: absolute;
bottom: 0;
}
実際にはCSSだけでこれを行うのは非常に簡単ですが、いくつかの小さな制限があります. これがどのように行われるかのデモです(コードを取得するにはソースを表示してください):
http://www.pmob.co.uk/temp/sticky-footer-ie8new-no-table.htm
必要な場合に備えて、これがどのように機能するかの詳細な説明を次に示します。