怎样解决子div设定float后会致使父div没法主动撑开的题目

本篇文章分享给大家的内容是对于子div设定float后会致使父div没法主动撑开，内容很细致，接下来我们就来看看概括的内容，但愿可以帮忙到大家。 本篇文章分享给大家的内容是对于子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; 也可以