div嵌套问题_html/css_WEB-ITnose

我弄了一个如下的嵌套格式：




其中css为：
#main { margin:0px;height:1000px;width:170px;background-image:url(../images/menu_bg.jpg);}
#menu { margin:0px;}

问题是：在不嵌套menu那个块之前，最外层的那个main块的背景的上边和左边都是贴着浏览器的边缘的，没有一点空隙，可是当我加入那个嵌套的menu块后，外层的那个main块的左边界没问题，可是上边界却往下移动了，没办法贴到浏览器的顶边，我试着给那个css加入 margin-top:0px，可是还是没有效果，不知道造成这种现象的原因是什么？
在线求高手解答，谢谢！

回复讨论(解决方案)

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>无标题文档</title><style>body {
margin:0;
padding:0}#main {
margin:0px;
height:1000px;
width:170px;
background:red;}#menu {
margin:0px;
background:blue;}</style><div id="main">  <div id="menu">目录</div></div>

前面打错了，我的#menu里面设置的margin是10px，这个设置的应该是menu那个块的外部空隙大小吧，按道理说，应该外面的main那个块不动，menu块往下移动10px，为什么设置了以后外面那个块也会往下移10px，可是左边的空间却没有问题

发现设置padding就可以了，可是还是很困惑，为什么设定内部div块的margin属性会使得外部的块也跟着移动呢。

http://leepiao.blog.163.com/blog/static/485031302010427113653/

这个帖子果然正解，万分感谢