Maison > Article > interface Web > div嵌套问题_html/css_WEB-ITnose
div嵌套问题_html/css_WEB-ITnose
- WBOYoriginal
- 2016-06-24 12:08:151027parcourir
我弄了一个如下的嵌套格式：
目录
其中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，可是还是没有效果，不知道造成这种现象的原因是什么？
在线求高手解答，谢谢！
回复讨论(解决方案)
<!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"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><style>body { margin:0; padding:0}#main { margin:0px; height:1000px; width:170px; background:red;}#menu { margin:0px; background:blue;}</style><body><div id="main"> <div id="menu">目录</div></div></body></html> 前面打错了，我的#menu里面设置的margin是10px，这个设置的应该是menu那个块的外部空隙大小吧，按道理说，应该外面的main那个块不动，menu块往下移动10px，为什么设置了以后外面那个块也会往下移10px，可是左边的空间却没有问题
发现设置padding就可以了，可是还是很困惑，为什么设定内部div块的margin属性会使得外部的块也跟着移动呢。
http://leepiao.blog.163.com/blog/static/485031302010427113653/
这个帖子果然正解，万分感谢
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：为什么连续2个div的margin 20 不会出现40？_html/css_WEB-ITnoseArticle suivant：请教个使用调用WebBrowser打印的问题_html/css_WEB-ITnose