解决div元素或UL、li在经过float后父层无法撑开的问题
-
最近开发论坛程序，帖子内容页需要有左边层和右边层，其中左边是用户信息，右边是帖子内容。
但是当我们做ui li之后，发现li的底边框border-bottom设置好像素和元素后，跑到上面去了。这个原因是因为LI中的两个DIV因为要并排，采用了float:left形式，这种浮动会使得LI无法按照内部的DIV层而撑开。
这是设计时的代码。
那么怎么解决呢？
一共有5中方法
第一种方法：
在LI或元素内层的最父级DIV（父LI内的样式为floor的DIV层）外层的内部，加入<div style="clear:both"></div>，问题解决。
第二种方法：给LI设置一个高度。但是这种方法因为LI中的元素如果会有很大的高度变化的话，建议不采用次方法，除非LI整体都是固定的。
第三种方法：给LI或最父级DIV设置单独的overflow:hidden或overflow:auto，如<li style="overflow:hidden">，<div class="floor" style="overflow:hidden">，问题得到解决。
第四种方法：给LI加浮动属性，可以换成float:right，但是很有可能布局就会受到影响。
第五种网友给出的方法：
用伪元素 ：after{
content:"";
display:block;
clear:both;
}
最终实现效果和目的
在给LI加入style="overflow:hidden"后，LI完美的被撑开了，同时Floor层也完美的展开。做好排版后，我们最后去掉这些边框颜色就达到目的啦！（精英网枫之精英原创，允许转载，但请注明出处）
