1

絶対値の後のフッターの調整に問題があり<div>ます。これはシナリオです:

<div>背景画像を含む があります - これは<div>絶対です 画像自体の上に配置された別のコンテンツにすべてのコンテンツが<div>あります フッターは画像の下に「浮かぶ」必要がありますが、これは起こりません。

ライブプレビュー

ご覧のとおり、フッターは画像の上にあります。画像の高さに関係なく、フッターはその下にあるはずです。

私のマークアップは次のようになります。

<div id="banner"><img src="#" /> Position Absolute</div>
<div id="container">
   Content goes in here
</div>
<div id="footer">
   This footer should always be under the banner
</div>

どんな提案も大歓迎です！

4

3 に答える 3

1

この方法を試しましたか

    <div id="banner">Position Absolute</div>
          <div id="container">
                   Content goes in here
          </div>
    <div class="clear"></div>
          <div id="footer">
                   This footer should always be under the banner
          </div>


    .clear{ clear:both}
      #footer{ position:absolute; bottom:0;}

注：フッターを下部に保持する回答を更新しました。

于 2012-12-10T10:52:41.340 に答える
0

問題が発生したかどうかはわかりません...しかし、「スティッキーフッター」を探していると思います。

問題はコンテンツ div です。コンテンツ div を相対または浮動小数点にする必要があります。その後、スティッキー フッターを追加できます。

<div id="footer">Footer</div>

#footer{position:fixed;bottom:0px;width:100%;....}
于 2012-12-10T13:54:02.507 に答える
0

絶対DIVを持ち、背景の位置を設定する代わりに。これを相対divにして背景画像を設定した方が良いでしょう。CSS の background-position と margin: 0 auto を使用して中央に浮かせることができます。そうすれば、フッター div は常にその下に配置されます。

相対 div では、絶対 div の配置は考慮されません。

于 2012-12-10T10:53:28.550 に答える