Archived topic
Primary menu
5 replies · Started by ammgbr on June 19, 2022
Hello, I have a primary menu on desktop and horizontal scrollable menu on mobile.
I wanted to change the xolour of the menu.
It works well on desktop.
With regards to the mobile menu how can I change the background colour of the menu categories only & not the background of the logo?
At present I have kept the same colour for the nav menu.
Hi there,
You can use the CSS below, feel free to change the screen max-width value.
@media (max-width: 768px) {
.main-navigation .main-nav >ul {
background-color: red;
}
.main-navigation .main-nav {
width: 100%;
}
}
I also noticed that the mobile header is enabled, but not in use, you can disable it at customizer > layout > header for better performance.
Hello, many thanks the colour changes now:)
I have increased the max-width and also reduced the layout container padding but still the background colour of the mobile menu navigation bar on mobile does not extend on its full length. I have tried clearing the cache multiple times.
Also, many thanks for the mobile header tip :)
I've updated the CSS here: https://generatepress.com/forums/topic/primary-menu-4/#post-2258174
Many thanks that works great!
You are welcome :)
