画面上端のmarginを消すには？

質問

現在CSSを猛勉強中なのですが、検索してもひっかからず、悩んでいるので質問させてください。

--- css ---
#maincontents{
width:100%;
height:400px;
background-image:url(../img/haikei.jpg);
background-repeat: no-repeat;
background-position: center;
}
--- html ---
<div id="maincontents">
</div>

これでブラウザで表示させると上端に隙間ができてしまっています。

margin-top: 0;　を　#maincontents{

に書いて試してみたのですがうまくいきません。
お分かりになりましたらご回答いただけたらと思います。

回答No.4

FASTECH · ベストアンサー

ごめんなさい。
「*」というのは、全てのＣＳＳに効果を及ぼすという意味なので、
全てきっちり詰めたいときは「*{ margin: 0px;}」を、
部分だけを消すには「body{ margin: 0px;}」を
使ってください。。。

お礼

どうもありがとうございました。細かく説明していただいて感謝します。

回答No.3

noname#165125

bodyのマージンで隙間が出来ているのかもしれません。

furucchさんと同様にbodyのマージンを指定していますが、
opera等一部のブラウザの対応のため
paddingでも指定しています。

--- css ---
body {
margin-top: 0px;
padding-top: 0px;
}
-----------

お礼

どうもありがとうとざいます。アクセシビリティも考慮しないといけないですね。とても参考になりました。

回答No.2

furucch

#1 FASTECH さんの補足として
BODY{ margin-top 0px; }
でもいいかもしれません。
* を使用すると他の要素にも影響しそうなので・・・

補足

どうもありがとうございます。とても分かりやすく説明いただきうれしいです。
＊
の意味などわかりましたら、教えていただきたいです。

回答No.1

FASTECH

* {
margin-top: 0px;
}

をＣＳＳファイルに追加してください。

左右下も消すには、

* {
margin: 0px;
}

です。
下のほうをおすすめします。。。

補足

ご回答ありがとうございます。
＊
というのはどういう定義なのでしょうか？