css - フロートコンテンツの下のスティッキーフッター

Question

私はコンテンツが中央に浮かんでいるページを持っているので、どのブラウザサイズでも、コンテンツdivは常に中央でスマックバンになります。

ここで、ページにスティッキーフッターを追加しましたが、ブラウザーウィンドウが予想よりも小さい場合、フッターはフロートされたコンテンツの前に表示されます。

フロートのクリアがどのように機能するか、または絶対ポジショニングが相対ポジショニングにどのように影響するかについて、私は正確に理解していません。フッターを絶対にすると、他のすべてのdivから独立するようになることを認識しています。これは当然私が望むものではありませんが、ここで行き詰まります。

私の質問は、ページの下部にスティッキーフッターを表示する方法ですが、ブラウザー画面の高さが小さい場合は、フロートされたコンテンツの下にとどまります（下を意味します）。

これが私の現在のコードの例です：http：//jsfiddle.net/ySru9/1/

ここからスティッキーフッターコードを取得しました：http ：//www.cssstickyfooter.com/style.cssおよびここhttp://ryanfait.com/sticky-footer/layout.css

これがSOに関する別の質問の繰り返しである場合は申し訳ありませんが、私は調べてみたところ、まったく同じものを見つけることができませんでした。私が掘り下げる必要があるいくつかの厄介なjqueryのものがあると思いますか？

score 2 · Accepted Answer

フッターを体の中で絶対的な位置に配置するが、体の高さが黄色のコンテナよりも最小限になっていることを確認すると、次のように機能する可能性があります。

score 1 · Accepted Answer

使用してみてください：

#container 
{
  margin: 0 0 0 -100px;
  position: relative;    
}

このフィドルを確認してください：http： //jsfiddle.net/ySru9/39/

2 に答える 2