Bootstrap3中的第n個孩子未正確對齊

Question

我似乎無法得到此工作，我有一個簡單的引導頁面與圖像庫，具有不同高度的圖像。我想用第n個孩子每四個.COL-MD-3

Bootply smippet後清除左側 - http://www.bootply.com/7BhYr6J8rH

完成頁面的內容將會從數據庫中動態填充，所以我需要這種靈活性來工作。任何人都可以指出我要出錯的地方嗎？

Answer 1

很難解釋，但您使用的是圖像上的第n個孩子。因爲沒有圖像列表，它將永遠不會到達第四個圖像，每個列只有一個圖像，不會再有圖像。然而，行不包含列的列表，所以我編輯你的代碼通過柱像這樣http://www.bootply.com/7BhYr6J8rH清除：

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

另一個想法，你可以做的是同樣的結果，並清潔每第四列之後添加<div class="clearfix"></div>碼。