Remove Empty Space Above Blogger / Blogspot Header

There's a huge empty space left on top of the blog's header after you remove the Blogger Navbar. This space often interferes with the blog's design by pushing down the header. It can be utilized to display - ads, navigation menu, social networking buttons and much more. So why waste it? 

Here's how you get rid of the empty space left after removing the navbar:

 

1. Log in to your blogger account

2. Go to Template -> Click Edit HTML and then Proceed.

3. Using Ctrl+F look for </head> tag:

4. Now add the following code just above the </head> tag:

<style type='text/css'>
.content-inner 
{ 
margin-top: -40px !important; 
}
</style>

5. Preview the template before saving.