How to Post HTML Tables in Blogger without the big gap ?

Have you ever tried posting tables in blogger ?

If you have done so ,you will see a huge gap in between the table and the text above it .Heres an example .

Name	Bit 7	Bit 6	Bit 5	Bit 4	Bit 3	Bit 2	Bit 1	Bit 0
ADRESH	A2D Result Register - High Byte
ADRESL	A2D Result Register - Low Byte
ADCON0	ADCS1	ADCS0	CHS2	CHS1	CHS0	GO/DONE	-	ADON
ADCON1	ADFM	-	-	-	PCFG3	PCFG2	PCFG1	PCFG0

So how do you get rid of the space between ?
First let me tell you why there is a huge gap when you post a table on blogger.Blogger inserts a line break tag tag every time you hit enter that is why you see a huge gap .
To get rid of this you will have to insert a small piece of CSS code which will solve the problem .

<style type="text/css">.nobrtable br { display: none }</style>


Paste this on the top of your post and use the div tag to reference it


<div class="nobrtable">

Post your table here -------------------

</div>


Heres the table after inserting the code .

registers for analogue inputs.

Name	Bit 7	Bit 6	Bit 5	Bit 4	Bit 3	Bit 2	Bit 1	Bit 0
ADRESH	A2D Result Register - High Byte
ADRESL	A2D Result Register - Low Byte
ADCON0	ADCS1	ADCS0	CHS2	CHS1	CHS0	GO/DONE	-	ADON
ADCON1	ADFM	-	-	-	PCFG3	PCFG2	PCFG1	PCFG0

YOu can see the table is correctly formatted .

How to remove the blogger bar on the top ?

REMOVE BLOGGER BAR ON THE TOP
I personally don't like the blogger bar at the top of blogger templates .Its good as well as bad .Its good because it provides a search box to search my blog .And bad because it gives an option to flag my blog for objectionable content which I guess you wont like if you blog about some "objectionable content" ;) .But Moreover who needs their search bar when you get cool google search box to search your site .

So how do you remove it ? .Heres a small piece of CSS code which will do the job .Go to
Layout
Edit HTML
Before doing any changes always copy the html code and save it in a text file in your PC .So that
if you mess up something you can always copy paste the code and get back your original template .Or you can download the templete in XML format as a backup .
Paste the following code inside the head tag inbetween the outer-wrapper and header-wrapper definitions

#b-navbar
{
height: 0px;
visibility: hidden;
display: none;}

#navbar-iframe
{
height: 0px;
visibility: hidden;
display: none;
}

<>

#outer-wrapper {
font: $bodyFont;
}
/* Header
----------------------------------------------- */
copy paste the above code exactly here
here goes the code
#b-navbar
{
height: 0px;
visibility: hidden;
display: none;}

#navbar-iframe
{
height: 0px;
visibility: hidden;
display: none;
}

#header-wrapper {
margin:0;
padding: 0;

< / head>
Preview to see if the bar has disappeared and then save the template and view your blog the blogger bar must have disappeared .