css - ページの上部とページの最初の div の間の空隙

Question

ここにサンプルhtmlがあります：

<style type="text/css">
.column
{
float: left;
width:33.3%;
}

#container
{
text-align: center; 
width:100%;
}

.clearfix 
{
display: inline-block; 
}
</style>
<div id="container" class="clearfix">
      <div class="column">left</div>
      <div class="column">middle</div>
      <div class="column">right</div>
</div>

この状況と同様の状況で、ほとんどの (すべての?) ブラウザーのページの上部とテキストを含む div の間にギャップがあるのはなぜだろうと思っていました。「top:-y px」を実行できることはわかっていますが、何か間違ったことをしていることはわかっています...

Answer 1

一部の (ほとんどの) ブラウザーは、特に指定しない限り、デフォルトのパディング、マージン、および境界線を追加します。次のようにして、これを防止してください。

html、本文 { マージン: 0px; パディング: 0px; ボーダー: 0px; }

そして、そこからあなたの条件でそれを取ります。デフォルトのブラウザ動作の説明は次のとおりです 。