Разрыв строки от определенной td до следующей строки

Question

У меня есть таблица, в которой <td> идут динамически, а некоторые <td> придут с определенным классом, на котором строка должна сломаться, а другая <td> должна начинаться со следующей строки.

По мере того как <td> идут динамически, я не могу создать еще <tr> Я хочу сломать его с помощью css.

Я видел другие примеры на StackOverflow, но они показывают нарушение всех <td> на следующую строку, но я хочу отдохнуть от конкретного <td> и все то другого <td> в продолжении от этого <td>

td.break { 
 
    display:block; 
 
}

<table> 
 
    <tr> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td class="break">hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td class="break">hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    </tr> 
 
</table>

Я пробовал использовать display:block, но его не работает, если вы используете только один <td>.

Answer 1

Хорошо благодаря Скрытому Гоббсу после его ответа я нашел способ сделать это.

Может быть, это не тот выдающийся код, но да, его работа абсолютно прекрасна.

Использование display:block в <tr> и float:left в .break

tr { 
 
    display: block 
 
} 
 
td.break { 
 
    float: left; 
 
    line-height: 22px; 
 
}

<table> 
 
    <tr> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td class="break">hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td class="break">hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    <td>hdv</td> 
 
    </tr> 
 
</table>

Немного line-height управляется как мы используем float:left