外边距塌陷问题

1.什么是外边距塌陷

外边距重叠也可以称之为外边距塌陷

块的上外边距(margin-top)和下外边距(margin-bottom)有时合并(折叠)为单个边距，其大小为单个边距的最大值(或如果它们相等，则仅为其中一个)，这种行为称为边距折叠。

1.什么时候发生外边距塌陷？

• 同一层相邻块元素（只有块元素才会发生塌陷问题）

两个盒子 ，上面的盒子有margin-bottom，下面有margin-top，会重叠，

 计算方式：

1. 两个块margin都为正，取其较大的一个

2. 两个块magin都为负，取其绝对值较大的一个

3. 一个块为负，一个块为正，取两个块margin之和

•  父子元素 子元素想要距离父元素50px，但是结果就是父元素也有了上边距，最后父子元素距上边100px，

 /*解决外边距塌陷的解决代码-1：给父元素加边框*/
            /*border: 1px solid #fff;*/
            /*解决外边距塌陷的解决代码-2：给父元素加溢出css*/
            /*overflow: hidden;*/
            /*解决外边距塌陷的解决代码-3：给父元素加固定定位*/
            /*position:fixed;*/
            /*解决外边距塌陷的解决代码-4：给父元素加浮动【不推荐，可能带来未知的错误】*/
            /*float: left;*/
            /*解决外边距塌陷的解决代码-5：给父元素设置display：table;*/
            /*display: table;*/
            /*padding: 0 10px 0 10px;*/
            /*解决外边距塌陷的解决代码-6：使用子绝父相*/
            /*position: relative;*/