how to style reduced version of mobile sticky menu

[Simone]

Hi, I’m working on this website http://www.divergence.ie and I really cannot figure out what selector to use to modify the navigation bar, as it appears on mobile when you scroll down. I’m simply trying to give it a white background and remove the box shading but I cannot make it happen. I think I probably am just using the wrong selector and I don’t know how to figure out the exact one. Could you guys help me with that?
All the best,
Simon

[Leo]

Hi Simon,

Try this CSS:

@media (max-width: 768px) {
    .generate-combined-header {
        background-color: #ffffff;
    }
}

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

I don’t see the box shading being applied currently?

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

[Tom]

This might be better as it will apply even if the header isn’t merged:

@media (max-width: 768px) {
    .main-navigation.navigation-stick {
        background:#FFF;
    }
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts