Problem with HTML table in blogspot post

Problem: Every time I try to insert a table, I create a huge space between the last line of text and the table. How do I prevent the space gaps?
This article will give solution for this problem.

Example of HTML table with empty space between the last line of text and the table when blogspot post is published:

A	B
C	D

This is problematic HTML code for table:

<table border="1" cellspacing="0" cellpadding="3" width="50%" align="center">
<tr>
  <td>A</td>
  <td>B</td>
</tr>
<tr>
  <td>C</td>
  <td>D</td>
</tr>
</table>

Problem is new lines. When you publish this code blospot will every new line represent with </br>. To resolve this problem in "Edit Posts" you should write all HTML table code in one line.

HTML code for table in blogspot post without unwanted empty space:

<table border="1" cellspacing="0" cellpadding="3" width="50%" align="center"><tr><td>A</td><td>B</td></tr><tr><td>C</td><td>D</td></tr></table>

Example without empty space:

A	B
C	D

This rule also apply for writing javascript inside blogger post and jquery inside blogger post.