码迷,mamicode.com
首页 > 其他好文 > 详细

margin-top 为什么会影响父元素的 margin-top

时间:2016-05-09 12:34:26      阅读:111      评论:0      收藏:0      [点我收藏+]

标签:

 1.原因:

 In this specification, the expression collapsing margins means that adjoining margins (no non-empty content, padding or border areas or clearance separate them) of two or more boxes (which may be next to one another or nested) combine to form a single margin.

----所有毗邻的两个或更多盒元素的margin将会合并为一个margin共享之。毗邻的定义为:同级或者嵌套的盒元素,并且它们之间没有非空内容、 Padding或Border分隔。

2.解决方法:

  1、修改父元素的高度,增加padding-top样式模拟(padding-top:1px;常用)
  2、为父元素添加overflow:hidden;样式即可(完美)
  3、为父元素或者子元素声明浮动(float:left;可用)
  4、为父元素添加border(border:1px solid transparent可用)
  5、为父元素或者子元素声明绝对定位

 

margin-top 为什么会影响父元素的 margin-top

标签:

原文地址:http://www.cnblogs.com/zouqin/p/5473277.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!