0

画面の下部に配置したいメニューバーがあります。配置を絶対に設定し、下からの距離を「0」に設定しましたが、何らかの理由で、どのように配置しようとしても、画面の中央から移動しません。誰かが私が間違っていることをキャッチできますか?

<div class=bmenu>
  <img src="bottommenu.gif" width=100% height="39" alt="" />
</div>

<style>
.bmenu
{
    position:absolute;
    z-index: 2;
    bottom:0;
    left:0;
    width:100%;
}
</style>

編集: 何人かのコメンテーターは、このコードはそれを一番下に配置すると言っています。これは、このコード フラグメントが残りのコードと相互作用する方法に問題があるということですか? 誰がそれを引き起こす可能性があるか知っていますか?

4

2 に答える 2

1

<html>ブラウザーの Web インスペクターのいずれかを使用すると、および<body>要素の高さが 100% ではなく、 であることがわかります。つまり、要素auto内のコンテンツが展開されたときの高さになります。

次のように、これらの要素の高さを設定する必要があります。

html, body {
    height: 100%;
}

これにより、ビューポートの高さいっぱいに表示されます。唯一の注意点は、マージンとパディングがheight の上にmargin-top追加されるため、他の要素で、margin-bottom、padding-topおよびを定義する必要があることです。padding-bottomheightwidth%

于 2012-11-01T20:33:41.170 に答える
0

このコードを使用してみてください：

.bmenu
{
    position:fixed;
    z-index: 2;
    bottom:0;
    left:0;
    width:100%;

}
于 2012-09-11T13:48:12.593 に答える