Как «очистить» строку поддельной таблицы CSS?

Question

По нескольким причинам я должен подделать таблицу для отображения изображений. Я хочу отобразить несколько строк с 5 изображениями в каждой строке. Поэтому я должен «очистить» (я знаю, что это не правильное слово) перед каждым 6-м изображением, чтобы начать новую строку.

Это галерея:

<div class="table"> 
<div class="tr"> 
    <div class="td"> 
     <img src="img/logo-1.jpg" alt=""> 
    </div> 
    <div class="td"> 
     <img src="img/logo-2.jpg" alt=""> 
    </div> 
    <div class="td"> 
     <img src="img/logo-3.jpg" alt=""> 
    </div> 
    <div class="td"> 
     <img src="img/logo-4.jpg" alt=""> 
    </div> 
    <div class="td"> 
     <img src="img/logo-5.jpg" alt=""> 
    </div> 
    <!-- i have to start a new row here ... --> 
    <div class="td"> 
     <img src="img/logo-6.jpg" alt=""> 
    </div> 
    <div class="td"> 
     <img src="img/logo-7.jpg" alt=""> 
    </div> 
</div> 
</div> 

И это, как я пытаюсь «очистить» до 6-го ряда:

.td:nth-child(5n+6):before { 
    display: block; 
    content: "new line please"; 
} 

Любая идея, как получить эту работу?

Answer 1

Просто введите этот код в свой css, и он будет работать нормально.

.td{ 
    display:inline; 
} 

Примечание я заменил свои IMG теги с тегами. Поскольку у меня не было тонны изображений. Вы можете использовать img тоже без проблем.

Вот jsfiddle http://jsfiddle.net/kvkr95sy/

Answer 2

Вы очень близко ... Это должно сделать это:

.td:nth-child(5n+6){ 
    display: block; 
    content: "new line please"; 
} 

Вам не нужен: перед тем псевдопользователей.