[Lee Ann]

From that I updated some of the code and it has been fixed. Thank you!!

[Lee Ann]

http://thelangcompanies.com/

[Lee Ann]

Thank you for your response, however, this does not fix my problem. The reason I have that code the way it is, is because we don’t want our menu at the top of the page, we want it closer to the line and the sub-menu items to show up right below the menu items when hovered over, which is what I did. The problem is that it is messing up the spacing on the (already turned on) responsive design on a phone. Is there a way to just fix the CSS for the phone?

Thank you!

[Lee Ann]

I was responding to the original post: https://www.themehorse.com/support-forum/topic/change-height-of-primary-menu-container/

I entered your code to change the height of the primary horizontal menu.

#access a {
height: 45px;
padding-top: 25px;
}
.search-toggle {
margin-top: 25px;
}
#site-logo {
margin-top: 18px;
}
#access ul li ul {
top: 70px;
}

@media only screen and (max-width: 767px) {
#site-logo {
margin: 10px 0;
}
.menu-toggle {
margin-top: 17px;
}
}

BUT – now the mobile menu is super spaced out. How can I fix this? Here is all of the Custom CSS I have:

#access a {
height: 45px;
padding-top: 95px;
}
.search-toggle {
margin-top: 25px;
padding-top: 70px;
}
#site-logo {
margin-top: 18px;
}
#access ul li ul {
top: 70px;
}

@media only screen and (max-width: 767px) {
#site-logo {
margin: 10px 0;
}
.menu-toggle {
margin-top: 17px;
}
}
#access ul li ul {
top: 120px;
}
hr{
padding: 5px;
margin: 0px;
margin-top:-1em;
}

[Author]

Posts