Removing the space between header and nav on Protostar

Question

I use Protosar template on Joomla.

I have tried for days now and I can't figure out how to remove the space/padding/margin between header tag and nav tag. I have done everything including zeroing margin and padding for the "header" and "navigation" classes but so far it hasn't worked. Any idea?

Answer 1

You have for your header a -20px value for the top attribute. This causes the header to go up -20px, creating this extra space.

This is located in templates/protostar/template.css on line 14113

Now, removing this top: -20px; will give you an extra space on top of the header. If you don't want this, then you have to adjust the padding for the container class - templates/protostar/template.css on line 14169.

.body .container {
  background-color: white;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  padding:20px;   **/* Change this to padding: 0 20px 20px; */**
...
} 

Change padding to padding: 0 20px 20px;