用overflow hidden来清除浮动，并形成新的bfc就不会受到左边的浮动高度的影响，右边的高度就是ul里面所占内容的高度。另外关于两列自适应布局 你可以看看这个demo

看了下demo, 问题根源是因为你在ul上加了clearfix，而cleafix:before的display设置的是table,所以ul的高度不准确了，至于原理，我也得需要进一步查下资料

什么原因不知道，通常我遇到都是添加个overflow: hidden;

。。。一开始还以为真的是BUG，好兴奋地看，最后发现是border的问题。。。

对于第一种布局，我能想到的解决方案是: 右侧内容区父元素 p.right-content 添加overflow: auto; 以此来屏蔽掉左侧浮动的影响。 右侧内容区内部容器 不会设置宽度,一般情况下不会受影响。

PS: 目前项目变更了样式，左侧可以采取position:absolute;方式可以满足需求，故而左侧修改为绝对定位了，也就不存在浮动导致右侧内容使用.cl时 因为内容不能与float在一行，导致高度变高的问题。