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?

  • You can use negative margins for the nav tag. For example .navigation{margin-top: -20px;}
    – Farahmand
    Aug 9, 2014 at 11:52

1 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;

  • Thanks for the answer and the time you put into this. I appreciated it.
    – agahi
    Aug 9, 2014 at 12:01
  • @agahi - If this answered your question, please accept it by clicking the "tick" icon on the left hand side.
    – Lodder
    Aug 9, 2014 at 16:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.