外边框塌陷及标准流浮动问题总结

一、外边框塌陷问题

1、并集关系的两个垂直排列的盒子，外边距紧挨在一起就会发生外边距合并，塌陷问题，取值方法就是取两者之间较大的值。

 

2、嵌套排列的两个盒子也有外边距塌陷问题

 

解决办法

1.给父级添加border属性，完整的划分出盒子边缘；

2.给父级或子级别添加float：left属性

3.给父级添加overflow：hidden属性

二、浮动问题

浮动是一种脱离标准流的形式 -- 半脱离

 

浮动可以使块级标签在一行共存

注意：浮动之后的标签是完全没有间距的左对齐和顶对齐；浮动后的标签显示模式为行内块

2.1 overflow的属性（控制超出父级的内容如何显示）

溢出隐藏

overflow：hidden

 

overflow：auto溢出滚动

 

overflow：hidden可以解决外边框塌陷问题，强制检测浮动流