6

<html>次のように、CSSを使用してタグと<body>タグの高さを100%に設定する必要があるアプリケーションがあります( JSFiddleバージョン)。

html, body {
  display: block;
  height: 100%;
  margin: 0px;
  padding: 0px;
  width: 100%;
}

body {
  background-color: #141414;
  overflow-x: hidden;
  overflow-y: auto;
}

これらのタグのスタイルを設定するすべてのCSSを含めました。ただし、ページのコンテンツが実際にどれだけ大きいか小さいかに関係なく、約20px下にスクロールできるスクロールバーが常にあります。この問題は、あらゆるサイズのスクリードでも発生します。

これらのスクリーンショットで理由がわかります。本文のIDはです#containerが、これはCSSスタイルではなく、JSターゲティングにのみ使用されることに注意してください。

ここに画像の説明を入力してください

同じページの3Dパースペクティブで、<body>タグがタグの上部から下にスライドしていることを示しています<html>

ここに画像の説明を入力してください

これらのタグには余白やパディングがなく、ページの上部にあるHTML要素には<body>タグを下に押すための余白やパディングがないため、本当に行き詰まっています。

<body>タグがページの上部と同じ高さになるようにCSSを修正するにはどうすればよいですか?

お時間をいただきありがとうございます。

4

3 に答える 3

3

試す

header {
    margin: 0px 17% 0px 17%;
}
于 2012-08-18T17:48:32.500 に答える
1

最も可能性の高い原因は、マージンの崩壊です。体に追加することで、これを「修正」できpadding: 0.01pxます。

この質問に答えようとする 2 回目の試みが、最初の試みほどばかげていないことを願っています XD

于 2012-08-18T17:50:28.920 に答える
-4

<html>との間に新しい行またはスペースがあるようです<body>...

これを試して:

<html><body>
    ...
</body></html>

それ以外の:

<html>
<body>
    ...
</body>
</html>
于 2012-08-19T17:28:08.430 に答える