Bootstrap3中的nth-child无法正确对齐

Question

我似乎无法让这个工作，我有一个简单的引导页面，图像库有不同高度的图像。我试图使用nth-child在每四个.col-md-3

之后清除左侧

Bootply smippet - http://www.bootply.com/7BhYr6J8rH

完成页面的内容将从数据库中动态填充，因此我需要这种灵活性才能工作。任何人都可以指出我出错的地方吗？

Answer 1

很难解释，但你在图像上使用了nth-child。因为没有图像列表所以它永远不会到达第4张图像，每列只有1张图像而不是更多。但是，一行确实包含列列表，因此我将代码编辑为按列清除http://www.bootply.com/7BhYr6J8rH：

.row .col-md-3:nth-child(5n) {
   clear:left;
}

另一个想法是，您可以做的是在每个第四列之后添加<div class="clearfix"></div>以获得相同的结果和更清晰的代码。