Reduce Header Height

This topic has 3 replies, 2 voices, and was last updated 8 years, 6 months ago by Wes.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Posts
March 2, 2014 at 9:26 pm #11087

Sami
Customer

I’ve followed the previous instructions on header height here:

.header-image .site-header .widget-area {
padding: 20px 0;
padding: 1.25rem 0;
}

and here:

.header-image .site-title a {
float: left;
min-height: 164px;
width: 100%;

without much luck. It did reduce, but I want to reduce it a little bit more.

Any other ideas as to how I can do this?

Thank you!
http://samanthagilbert.com

March 2, 2014 at 9:29 pm #11088
Wes
Moderator
The minimum height in your code is set at 164px. So you would need to adjust that if you have a logo that doesn’t require that much space. Other than that, the menu links on the right have padding on the top and bottom which adds to the header height. This can be found around line 2024 in your css –
```
.genesis-nav-menu a {
border: none;
color: #fff;
display: block;
font-weight: 400;
padding: 13px;
position: relative;
}
```
You can change the padding like this – padding: 8px 13px;….The “8px” represents the top and bottom, so adjust that number if you need to.
March 2, 2014 at 9:41 pm #11091

Sami
Customer

I changed the min height to 0, but this is what did the trick!

Awesome! Thank you Wes! 🙂

March 3, 2014 at 8:02 am #11102

Wes
Moderator

You’re Welcome!
Author

Posts

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.