break row from specific td to next line

Question

I have a table in which <td> are coming dynamically and some <td> will come with specific class on which the row should break and other <td> should start from next line.

As the <td> are coming dynamically i can't create another <tr> i want to break it with css.

I have seen other examples on stackoverflow but they are showing breaking all the <td> to next line but i want to break from specific <td> and all then other <td> in continuation from this <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>

I tried using display:block but its not working if appying on single <td>.

Answer 1

Well thanks to Hidden Hobbes after his answer i found a way to do it.

May be its not that prominent code but yes its working absolutely fine.

Using display:block in <tr> and float:left in .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>

A little line-height is managed as we use float:left