Weird display behaviour

I have been using the online tool html-cleaner.com for months to create html code for my site.

This morning I inserted new product info:

<h3 style="text-align: center;">Aluminium baking trays</h3>
<table style="height: 116px;" width="577">
<tbody>
<tr>
<td><strong>Order code</strong></td>
<td><strong>Dimensions</strong></td>
<td><strong>Model</strong></td>
</tr>
<tr>
<td>BTA0001</td>
<td>650 x 530 x 10mm</td>
<td>1</td>
</tr>
<tr>
<td>BTA0002</td>
<td>600 x 400 x 12mm</td>
<td>2</td>
</tr>
<tr>
<td>BTA0006</td>
<td>520 x 420 x 19mm</td>
<td>3 </td>
</tr>
<tr>
<td>BTA0007</td>
<td>529 x 420 x 38mm</td>
<td>4</td>
</tr>
<tr>
<td>BTA0008</td>
<td>650 x 530 x 40mm</td>
<td>5</td>
</tr>
<tr>
<td>BTA0009</td>
<td>457 x 660 x 25mm</td>
<td>6 </td>
</tr>
<tr>
<td>BTA0010</td>
<td>457 x 330 x 25mm</td>
<td>7</td>
</tr>
<tr>
<td>BTA0011</td>
<td>600 x 400 x 20mm</td>
<td>8</td>
</tr>
<tr>
<td>BTA0014</td>
<td>600 x 400 x 40mm</td>
<td>9</td>
</tr>
</tbody>
</table>

The result is confusing. It displays a huge gap between the description and the table: see here

Fixed.

I added the paragraph tags as below

<h3 style="text-align: center;">Aluminium baking trays</h3>
<p></p>
<table style="height: 116px;" width="577">
<tbody>