响应式设计和clearfix

Question

我有这个响应式页面布局。该<aside>是恒定的宽度和.main面积有margin-right。我这样做是因为我想让.main区域适应不同的设备，而<aside>保持不变。

http://jsfiddle.net/c6mZN/1/

的问题，正如你所看到的，是我的主要区域对象的列表，还可以使用clearfix内，并且第一个元素清除对象一路直到的结束侧边栏。我想要的是，它看起来完全像其余的.block

我怎么能做到这一点？

Answer 1

Forked your fiddle with fixed code.

你.main元素需要知道它有一个单独的“格式化内容”，使得其子女可以忽略外部布局流程：在符合标准的浏览器来做到这一点的唯一方法是使用overflow: hidden：

.main { 
    overflow: hidden; 
} 

顺便说一句，你就可以得到上.main摆脱保证金的，它会自动占据留下任何空间（这样你就可以改变的aside宽度，你认为合适，甚至可以添加额外的列） - 然后我给了asidemargin-left: 10px来规定它需要保持你的布局不变的差距。