本篇文章分享给大家的内容是关于子div设置float后会导致父div无法自动撑开，内容很详细，接下来我们就来看看具体的内容，希望可以帮助到大家。
原因：内部的p因为float:left之后，就丢失了clear:both和display:block的样式，所以外部的p不会被撑开。
以下是几种解决办法（假设父p的class为“container”）:
方法1、使用伪类
container::after{
display: block;
height:0;
content: '';
clear: both;
}
container{
display: inline-block; /*第一种撑开办法，底下会有部分被遮到，所以添加这行，就完美了*/
}方法2、不撑开的原理是overflow不可见，所以给父p添加overflow:auto;就行，IE要用_height:1%;
container{
overflow: auto;/*让主要内容区随内容自动撑开*/
overflow-y:hidden;/*把出现的滚动条隐藏，但是底下会被遮到一点，不完美*/
_height:1%;/*对IE的hack*/
}方法3、可以专门最后添加一个子p用来清除浮动：
设置样式.clear{clear:both; font-size:0; height:1%;}方法4、可以设置父p的高度（也就是手动撑开，不灵活）；
方法5、直接给父p设置
display: inline-block;这样也自动撑开方法6、直接给子p设置
display: inline-block;也能自动撑开，但是排版问题有待研究学习方法7、从网上还发现了一种方法，给父p增加属性：
display:table;方法8、 子p浮动我就套不住你?OK,我让父p也浮动: 父p设置
float: left;也可以
相关推荐：
