/ /ページが絶対配置で作られたときにフッターを一番下にする - html、css、css-position、footer、sticky-footer

ページが絶対配置で作成されたときにフッターを下に取得 - html、css、css-position、footer、sticky-footer

私は、そのセクションが絶対的に配置されたdivで作られたページを持っています。

それは私がページにフッタを取得しようとするまでうまくいった。

私の問題は、私が底を使うことができないことですボトムプロパティでページを表示するのではなく、画面の下部に固定するため、フッターに配置するプロパティ。したがって、ページのコンテンツが画面よりも長い場合は、フッターがコンテンツの下に表示されます。

そして、私はちょうどフッタを要素の流れがないので要素の流れ。すべてのdivは絶対的に配置されているので、静的であるか相対的に配置されているものを置くと、ヘッダーの下のページの一番上に移動します。

これらの固定フッターは、ページの下部にフッターを配置する要素の流れに依存するため、動作しません。

ここにjsbinがあります: http://jsbin.com/oxefev/edit#javascript,html

この問題を解決する方法があれば、この問題は非常に簡単に解決できます。 bottom CSSのプロパティは画面の代わりにページの下部に移動します。

編集: 私はそれを静的に配置し、 margin-top プロパティを設定して強制的にページの下部に移動する margin-top:1000px; しかし、私はページにコンテンツを追加したり削除したりするたびに変更する必要があります。

回答:

回答№1は2

私の最初の勧告は、絶対にすべてのものを置くことはありません。それは何のメリットですか?

それにもかかわらず、あなたはjavascriptの柔らかいアプリケーションで求めるものを達成することができます。何かのようなもの:

document.getElementById("footer").style.top = document.getElementById("content-wrapper").clientHeight + 150 + "px";

編集:

これはうまくいくようにも見えますが、ヘッダーの高さを調整すると、変更する必要はありません(ボックスモデルに基づいて+/-数ピクセル)。

document.getElementById("footer").style.top = document.body.clientHeight + document.getElementById("footer").clientHeight + "px";

回答№2の場合は0

jQuery(document).height()は、正しいブラウザ間検索結果を返します。コンテンツの配置の高さを知ったら、フッターを簡単にする必要があります。