上部の余白をなくしたいのですが・・・
Dreamweaver CS5でホームページを作成しています。
デザインビューで見ると一番上に隙間は出来ないのですが、ライブビューやブラウザーでプレビューすると,隙間が出来てしまいます。上部に隙間が出来ない方法を教えてください。
<body>
<div id="headWrap">
<div id="header">
<h1><img src="imges/rogo.png" alt="**" width="365" height="74" /></h1>
<ul>
<li><a href="#">**</a></li>
<li><a href="#">**</a></li>
</ul>
</div>
</div>
<div id="menu">
<div id="button">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="#">HOME</a> </li>
<li><a href="#">**</a> </li>
</ul>
</div>
</div>
<div id="contents">
<p>id "contents" の内容<!--/#contents--></p>
</div>
<div id="footer">
<div id="footerMenu">
<ul><li><a href="#">ホーム</a></li>
<li><a href="#">**</a> </li>
</ul>
<address>Copyright © All Rights Reserved.</address>
</div>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
CSS部分
* {
font-family:"Hiragino Kaku Gothic Pro", HiraKakuPro-W3, "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "MS P ゴシック", verdana, sans-serif;color:#333;
}
body {background: #FFF url(imges/bg_body.gif) repeat-x left top;
margin: 0px;
padding: 0px;
}
a {text-decoration:none;
}
#headWrap {width: 100%;
background: url(imges/bgimgHead.jpg) repeat-x left top;
margin: 0px auto;
padding: 0px 10px;
}
#header {height: 90px;
width: 850px;
margin: 0px auto;
}
#menu {height: 100px;
width: 100%;
background: url(imges/bgimgMemu.jpg) repeat-x left top;
clear: both;
}
#button {height: 40px;
width: 850px;
margin: 0px auto;
}
#contents {width: 850px;
background: #FFF;
margin: 0px auto;
clear: both;
}
#footer {width: 100%;
background: url(imges/bgimgFoot.jpg) repeat-x left top;
margin: 0px;
}
#footerMenu {margin: 0px auto;
width: 850px;
}
#headWrap #header ul li {float: right;
list-style: none;
padding-left: 10px;
padding-right: 10px;
}
#headWrap #header h1 img {float: left;
margin-top: 0px;
}
#footer #footerMenu ul li {float: left;
list-style: none;
padding-right: 5px;
｝
どうぞよろしくお願いします。
補足
ご回答有難うございました。下記のソースの部分なんですが、なんで本のとうりソースを入力しているのに上部がプラウザの画面と接しないのがわからないのです。なんか本によると古いOperaではpaddingとプロパティを指定しないと余白は消せないと書いてありますが。（アンインソール済みですが） 皆さんこのようになるのですか？出来たら本のとうりの画面になってくれたらと願っています。なんとか教えて頂けませんか？よろしくお願い致します。 body {background-color: #aaccff; background-image: url(back-border.png); background-repeat: repeat-y; background-position: top center; margin: 0; padding: 0;} このmargin: 0;を-20px;にしたらプラウザの画面と接しましたが、左側が少しカットされています。 この状態で本を進めていくと、やはり途中でおかしな画面になってしまいますので、なんとかならないかとご質問した次第です。あと、本の最初からの入力でも上部が本の写真と違って余白大きくなっています。私のパソコンがおかしいのでしょうか？ よろしくお願い致します。