Remove Blogger Navigation Bar AND whitespace

Problem
Didn't want the default Blogger NavBar.  Found a way to remove / hide it, but the whitespace reserved for it remained.

Solution
The "#navbar-iframe" code below removes the NavBar, but in my case it did not remove the whitespace.  The following line was supposed to remove the whitespace but did not; so I started adjusting it with negative numbers and bingo!  For this blog I found -60 removed all the whitespace, results may vary!

Add the following code within the STYLE section of your template if there is one, otherwise add the STYLE tags as below.

<style type='text/css'>
<!--Remove NavBar -->
#navbar-iframe {height: 0px; visibility: hidden; display: none;}
body #header {margin-top:-60px !tweak until you get desired results;}
</style>


Add it where???
If you're not familiar with editing the template, here is a step-by-step guide:

1. Log into your blogger.com account
2. Within "Manage Blogs", click DESIGN on the blog you want to apply this to
3. You will be taken to the "Page Elements" screen.  Now click EDIT HTML under the tabs.
4. To be on the safe side, you may want to backup your current template with the option provided
5. Search for "</style>" on the page to see if there is a style section, if there is, add the code there (without the STYLE lines).
6. If not, search for </head> and then add the code above it, including the STYLE lines.
7. Preview it, if it still has whitespace try increasing the number.  If it cuts off your header, try decreasing the number.  Increments of 10 would be good to work with.

Update: (you  may need to follow these steps for different templates)

Here are the steps to remove the Blogger Navigation bar /Blogger Nav Bar

1. Log into your blogger account
2. From your Dashboard choose Layout
3. Now choose the Edit Html option
4. You will see your template code

5. Optional: you may want to copy and paste it to Notepad (or something) as a backup
6. In that template code find

]]></b:skin>

and replace it with

#navbar-iframe,#navbar { display: none !important; }
]]></b:skin>

7. Preview it - the nav bar should be gone. 

8. Now select SaveTemplate.