Create html table row without tr tag
Solution 1:
I wonder whether something like this might work for you:
tbody, thead {
display: contents;
}
tr {
display: table-row-group;
}
td.row {
display: table-row;
background: rgb(200 197 255 / 63%);
}
td.row div {
display: table-cell;
}
<table>
<tbody>
<tr style="text-align: center; background: rgba(252,212,212,0.63);">
<td class="text-center" style="font-weight: bold;">AAA</td>
<td class="text-center">T1</td>
<td class="text-center">300 cm</td>
<td class="text-center">60% poliestere, 40% viscosa</td>
<td class="text-center">Tenda piombata</td>
<td class="text-center">50 € (25+ mtl)<br /></td>
<td class="text-center">75 €<br /></td>
</tr>
<tr style="text-align: center; background: rgba(252,212,212,0.63);">
<td class="text-center" style="font-weight: bold;">BBB</td>
<td class="text-center">T1</td>
<td class="text-center">100 cm</td>
<td class="text-center">60% poliestere, 30% viscosa, 10% cotone</td>
<td class="text-center">Tenda piombata</td>
<td class="text-center">50 € (25+ mtl)<br /></td>
<td class="text-center">75 €<br /></td>
<td class="row">
<div class="text-center">2649</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
</td>
<td class="row">
<div class="text-center">8765</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
</td>
</tr>
<tr style="text-align: center; background: rgba(252,212,212,0.63);">
<td class="text-center" style="font-weight: bold;">CCC</td>
<td class="text-center">T1</td>
<td class="text-center">800 cm</td>
<td class="text-center">60% poliestere, 30% viscosa, 10% cotone</td>
<td class="text-center">Tenda piombata</td>
<td class="text-center">50 € (25+ mtl)<br /></td>
<td class="text-center">75 €<br /></td>
<td class="row">
<div class="text-center">4598</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
<div class="text-center">//</div>
</td>
</tr>
</tbody>
</table>
See this idea with table sorter logic at https://jsfiddle.net/Lb9ye6ta/