Mobile Menu Changes

Hi Chris,

The link is not working for me. Can you double check?

Is this the site?: http://gtg2017.giantishere.com/

If so, the mobile menu has a shadow to separate it, and the navigation search looks good: https://www.screencast.com/t/P2lT5jAS

As for the button, try this:

@media (max-width: 768px) {
    .button.gtg-btn-red-header a {
        display: inline-block;
    }
}

That worked for the button. Thanks!

I've added this code to decrease the buttons padding in the mobile menu but it doesn't seem to be sticking for some reason.

.button.gtg-btn-red-header a,
.button.gtg-btn-red-header a:visited {
	color: #ffffff !important;
	background-color: #CF0A2C !important;
	padding: 6px 12px !important;
	margin: -15px -10px 0 -10px !important;
    border-radius: 12px !important;
}
.button.gtg-btn-red-header a:hover,
.button.gtg-btn-red-header a:active {
	background-color: #97021c !important;
	color: #ffffff !important;
}
@media (max-width: 768px) {
    .button.gtg-btn-red-header a {
        display: inline-block;
        padding: 3px 7px !important;
    }
}

You'd have to do this:

@media (max-width: 768px) {
    .button.gtg-btn-red-header a,
    .button.gtg-btn-red-header a:visited {
        display: inline-block;
        padding: 3px 7px !important;
    }
}

For some reason, the height of the button is still not changing. It will affect the width, but no the height.

Try: line-height: 15px;

No effect.

Change this selector:

.button.gtg-btn-red-header a, 
.button.gtg-btn-red-header a:visited

To:

.main-navigation .main-nav ul li.button.gtg-btn-red-header a,
.main-navigation .main-nav ul li.button.gtg-btn-red-header a:visited

Just wanted to let you know I've tried this and it seems to have no effect.

https://docs.generatepress.com/article/mobile-navigation/#initiating-the-mobile-navigation-at-a-different-width

http://gtg2017.giantishere.com/contact-forms/newsletter-signup/

http://i.imgur.com/hhL7tML.jpg

Thanks!

Hmm don't see the CSS being executed. Everything is still triggering at 768px.

Any chance there are syntax errors above the code you've added that stops this CSS from being executing?

I'll check.

That's the second time now. I'll check that first before posting. Thanks as always!

Glad we could help!