首先，为了极其清晰，这里有一个JS小提琴，展示了我想要实现的目标：
http://jsfiddle.net/bb_matt/VsH7X/
以下是解释 - 我的理由：
我正在使用1140网格框架创建响应式网站。 这是一个相当复杂的布局。
我已经创建了一个可重复使用的简单图库类，它可以放入任何已定义的列大小＆amp;使用媒体查询，我将相关的百分比宽度应用于li元素。 每个li元素的右边距为5％。 我在媒体查询中使用nth-child（xn + x）来删除每行末尾的右边距。
一切运作良好 - 随着布局调整大小，图像会调整大小，连续的图库项目数量会根据百分比定义。
要解决的唯一问题是在行之间清除。 我无法添加额外的html标记，我想避开过于复杂的jquery修复。
我知道有两种方法可以解决这个问题，但我并不热衷于这两种方法。
首先修复，只需在li元素上使用display：inline-block，顶部垂直对齐，就可以正确地传输所有内容... 然而，所有百分比都会被拍摄和画廊项目不再整齐地适应分配的空间。
第二次修复，给列表项目一个高度。这是我必要的路线 - 根据分辨率需要不同的高度 - 没什么大不了的，但不是那么整洁。
答案 0 :(得分：6)
我在这里更新了你的小提琴：http://jsfiddle.net/VsH7X/5/
我在每个新行的第一项中添加了clear: left。
ul.gallery li:nth-child(5n+6) {
clear: left;
}
请记住，:nth-child伪类在IE6-8或FF3及以下版本中不起作用。