Question

css子元素浮动后父元素高度不能自动撑开

.news是父级元素，它的子元素li浮动后父级元素.news高度就无法自动适应了
如果你看不清楚上面的图片你就把图片拖出来看，图片是很大很清楚的，只是百度提问这个框架让他等比例缩小而已

Answer 1

1、首先新建一个html文件，命名为test.html。

2、在test.html文件内，使用p标签创建两行文字，代码如下。

3、在test.html文件内，设置第一个p标签id属性为mp，主要用于下面使用css设置该p元素隐藏。

4、在test.html文件内，编写标签<style type="text/css"></style>，下面将在标签内编写css样式。

5、在css标签内，使用css设置p标签的行高为30px，在浏览器运行test.html。

6、在css标签内，对id为mp的p元素样式进行单独定义，通过dispay属性设置为none，实现该p元素隐藏不可见。

7、最后在浏览器打开test.html文件，查看实现的效果。

Answer 2

三种方法可以解决：
1、给父元素（也就是你的.new）加一个overflow:hidden；
2、将父元素也一起浮动（这个比较复杂，会影响到父元素的同级元素）；
3、在父元素的最后一个子元素（也就是你的ul标签）后边再增加多一个非浮动的子元素，然后将这个子元素加个clear（例：<div style="clear:both"></div>）

至于第3种方法的原理嘛…是因为父元素一定会包围着他所有遵循标准流的子元素（也就是你在最后新加的那个非浮动子元素），而这个子元素的顶部会紧贴在你的ul底部，所以父元素会因此撑开高度。
（CSS浮动原理：如果B元素浮动，上一个元素也是浮动的话，会紧跟其后，除非不够宽才会另起一行；如果上一个元素不是浮动的话，也就是遵循标准流，那么B元素顶部会紧贴上一个元素底部；当然，如果B元素不浮动，是遵循文档流的话，就会默认占一行了）
关于CSS浮动这里有篇通俗易懂的文章：
http://www.cnblogs.com/zhongxinWang/archive/2013/03/27/2984764.html#commentform

Answer 3

所以说要清理浮动，百度下：清理浮动 或 清楚浮动，有n种相关方法，把它学会，清理之后就正常了。

记住，99%的情况下你只要用了浮动，接下来第一件事就是清理。

追问

我清除过了，还是没用~~~

追答

方法不对或其他代码有问题，你这样发个图是看不出来的。

Answer 4

加一个dispaly:table:
clear:both

Answer 5

你给news加一个overflow:hidden