2010-12-19 12 views
0

はねえ、私は下のスティッキーフッターlink testを行うにしようとしていたと、それはそれはlitleビットをスクロール意味もっとして100%と保管...CSS:どのようにhtml、体の高さが来る:100%は100%以上ですか?

ので、私は、任意の追加なしに、簡単なHTMLコードを作ったが、そのことがさらに100%よりも、ここを参照してください:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="he" lang="he" dir="rtl" id="bangler"> 
    <head> 
     <title>my title</title> 
     <style type="text/css"> 
     html, body, #wrapper { height: 100%; } 
     body > #wrapper { height: auto; min-height: 100%; } 
     </style> 
    </head> 
    <body> 
     <div id="wrapper">aa</div> 
    </body> 
</html> 

事がある、それはおよそ5-10px以上を意味し、100%、その後少しだけよりは、スクロール...これはIEとFirefoxの両方で、本当に不思議です!

ありがとうございます!

答えて

7

デフォルトのbodyの余白が原因です。あなたのスタイルにこれを追加:paddingおよび/またはmarginので(ブラウザによって異なります)

body { margin: 0; padding: 0; } 
0

デフォルトでhtmlおよび/またはbodyための非ゼロであり、コンテンツの高さの周りのパディングとマージンのラップ。

-1

すべてのブラウザには小さな癖があり、セレクタと属性の表示方法が少し違っているので、BoltClockの答えはすべてのブラウザがマージンゼロでパディングがゼロになるようにしています。

CSSリセットを検索すると、その詳細についての情報が表示されます。

1

私のウェブサイトとのクロスブラウザの互換性を保証するため、私は常に自分自身の体のマージンを定義します。このケースでは:html, body {margin: 0 0 0 0; padding: 0 0 0 0; }
私はCSSのかなりの部分を学ぶまで自分自身があらかじめ定義された余白とパディングを持っていたことに気付きませんでした。

+1

マージン:0 0 0 0;冗長な構文です。 – Flack

+0

私は同意しますが、私はそれを素早く調整するために使用します。 – Yoshiyahu

関連する問題