Home > Web Front-end > HTML Tutorial > 子DIV设置了外边距为什么父级也跟着下移了_html/css_WEB-ITnose

子DIV设置了外边距为什么父级也跟着下移了_html/css_WEB-ITnose

WBOY
Release: 2016-06-21 09:47:23
Original
1846 people have browsed it

css

css代码如下
#header-div{
height:80px;
background-color:#c0c0c0;
}
#logo-div{
height:50px;
width:200px;
margin-left:120px;
margin-top:10px;
background-color:#400040;
html代码

  

   子DIV设置了外边距为什么父级也跟着下移了_html/css_WEB-ITnose
  


回复讨论(解决方案)

父级元素没有确切的宽度,不符合和模型的里的定义,虽然div的display默认是block。你可以设置一下宽度,这样父级元素就不会跑了。

子的margin效果 直接作用到了父身上

但我直接把子级浮动了竟然好了, ,搞不懂了。这盒模型理解不够透彻了,求教大神们是怎么写CSS代码的,难道每个盒子都固定宽高,。

话说,这就是外边距叠加的问题嘛,可以搜搜看;

外边距叠加只会出现在两个块级元素之间,并且父元素不能有padding或者border才会出现叠加呢。
浮动的元素不会出现外边距叠加。

这里,你给父元素加个border,或者加个padding也可以解决你说的问题的。

稍微整理过一次margin的问题,可以参考一下啊: http://blog.csdn.net/zyl_lyr1019/article/details/14215355

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template