How to remove an unwanted space above blog header in blogger?

We have learned how to remove Navbar from blogger. But when the Navbar is being removed, an unwanted space comes up just above the header of a blog. 
   
This appears bit unprofessional. And who would love unprofessional blog? Therefore, today let us learn how to remove or reduce this space from the blog and try making it appear more professional.
        

But don't worry. There is nothing much to be done. It's simple and easy. I will guide you step by step. 

Step 1

Login to your blogger account

Step 2

Select a blog (if you have more)

Step 3

Click on drop-down menu

Step 4

Click on the button Template

Step 5

Click on the button Edit HTML

Step 6

Find (ctrl+f) the code: </head> 

Step 7

Just above the code in step#6, copy and paste the given code:

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

You can change blue colored font in step#7 to have desirable space above your blog header. By rule of integers, higher (-)ve value will reduce the space.