Archived topic
Mobile sticky menu
5 replies · Started by Grant on May 19, 2017
Hi,
I am getting into a bit of a pickle, a site I am working on has the menu to the right inline with the logo on the left. White background, grey writing. Once on mobile, I wish to have a grey menu background, logo to left, white text.
What is the most efficient way of achieving this?
I am writing some css, but then it overwrites the settings I have made in GP appearance. Hence the pickle, so I am just wondering how some of the more experienced members would achieve the same goal?
Hi Grant,
I would recommend using the mobile header: https://docs.generatepress.com/article/mobile-header/
Then add this CSS:
@media (max-width:768px) {
.main-navigation {
background-color: #000000;
}
.main-navigation .main-nav ul li a {
color: #ffffff;
}
}Here is the list of navigation CSS: https://gist.github.com/generatepress/793804f553c25c70823c
Just have to wrap them in the @media bracket like the above then they should only apply to mobile.
Let me know if you need more info :)
Do you have some ideas why the mobile sticky menu may not be working on my site?
https://kimsellstheemeraldcoast.com/
Best,
John
Hi John,
Can you open a new topic for your question?
Thanks!
sorry about that. that's what i tried to do.
No problem :)