Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
The problem is coming from the height of your links, which you’ve tried to shorten using this style:
#top-menu {
...
height: 38px;
}
This doesn’t work, because the links still have height above the link text (which is causing the gap).
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Actually there are many styles you’ve added that are going to cause problems with the height of the header.
It’s better if we start from scratch.
Can you describe how you want your header to appear on desktop and mobile?
Hi Andrew, I appreciate you taking a look. I would like for the header to not be present and for the menu to remain at the top of the page. I had tried removing the header (display: none) but that removes the menu as well, so I jerry-rigged some code to move it out of view and resize the menu. I understand that’s not the correct way to do it, though.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
In the “Additional CSS” part of the dashboard try adding this to the bottom:
#masthead .navigation-top {
margin-bottom: 0;
}
#top-menu {
height: auto;
margin: 0;
}
.site-navigation-fixed.navigation-top {
position: static !important;
}
.navigation-top {
position: static;
}
.hero-slider .home-slider-overlay {
opacity: 0.7 !important;
}
.main-navigation a {
padding: 0 1.25em;
}
.main-navigation li {
margin: 0;
}
.page-id-174 .site-header {
margin: 0;
}
.custom-header {
display: none;
}
.navigation-top .wrap {
max-width: none;
padding: 0;
}
