Different color in the sticky menu

Hi there,

can you link us to your site so i can take a look at the simplest method ?

Yes, sure: https://getmoresteps.com/

Takes some CSS:

/* Set Background of navigation bar */
.sticky-enabled .main-navigation.is_stuck {
    background-color: #000000;
}

/* Set menu item colors */
.sticky-enabled .main-navigation.is_stuck .main-nav ul li>a {
    color: #ffffff;
    background-color: #000;
}

/* Set meni item current and hover color  */
.sticky-enabled .main-navigation.is_stuck .main-nav ul li:hover>a,
.sticky-enabled .main-navigation.is_stuck .main-nav ul li[class*="current-menu-"]>a {
    color: #000000;
    background-color: #ffffff;
}

Thanks a lot. Where should I put this code?

Adding CSS: https://docs.generatepress.com/article/adding-css/

David i use that css
/* Set Background of navigation bar */
.sticky-enabled .main-navigation.is_stuck {
background-color: #000000;
}

/* Set menu item colors */
.sticky-enabled .main-navigation.is_stuck .main-nav ul li>a {
color: #ffffff;
background-color: #000;
}

/* Set meni item current and hover color */
.sticky-enabled .main-navigation.is_stuck .main-nav ul li:hover>a,
.sticky-enabled .main-navigation.is_stuck .main-nav ul li[class*="current-menu-"]>a {
color: #000000;
background-color: #ffffff;
}

But on mobile mine header is only white.

Hi Artur,

Can you open a new topic and link us to your site?

The CSS is site dependent as you might not be using the same settings as the topic starter.