Responsive nav masthead height at 992px width

Sparkling
1

Hi Movin!
I am trying to keep my header at the same height in responsive mode thru 768px. However, at 992px, it drops the nav menu down and aligns weirdly. I assume it is because of some added padding somewhere but I can’t seem to figure out what is causing it. I searched the forum but couldn’t find a solution that worked.

The url is http://lucyjunus.com/wp/

Any leads would be greatly appreciated! This WP rookie is still a rookie! Lol!

Thank you,
Mark

2

Hi Mark,

I hope you are well today and thank you for your question.

I visited your shared site but it doesn’t happen for me as shown in the attached screenshot.

Please test it clearing your browser cache or using different browser.

Which browser are you using to test it?

Best Regards,
Movin

3

Hi Movin - thank you for your prompt response. It looks like the problem only occurs on OSX, viewing on Mozilla Firefox 55.0.3 (64-bit). I viewed on Chrome and Safari and it is fine.

Thank you,
Mark

4

You can try resolving this issue by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Additional CSS

.collapse.navbar-collapse.navbar-ex1-collapse {
    padding: 0;
}

.collapse.navbar-collapse.navbar-ex1-collapse .navbar-nav > li:first-child > a {
    padding-left: 0;
}

.collapse.navbar-collapse.navbar-ex1-collapse .navbar-nav > li:last-child > a {
    padding-right: 0;
}
5

Thank you Movin! Worked like a charm!

6

You are most welcome here :slight_smile: