Changing Mobile Menu Text Colour

Blaskan
1

Hi Support,

I have been able to customize everything I need by amending included CSS and adding custom CSS but I’m struggling at the final hurdle, please can you advise how I would change the text colour on the main menu for mobile users?

I’m currently using this code to manipulate the background menu color on mobile, I’m sure its something simple that needs adding…

/*change color on mobile media query*/
@media screen and (max-width: 768px){
.main-navigation .blaskan-main-menu > ul, .main-navigation .blaskan-main-menu > div {
    background: #000000;
  }
  #primary-menu > li > a,.main-navigation ul ul li a {
    color: #fff;
  }
  .main-navigation ul ul li{
    background-color:#fff;
  }
  
}

Thanks
Coffee

2

Hello there,

I hope you are doing well today.

What you have there seems correct but the menu color by default is white so please try changing the color.

You can try using the following CSS code to change the font color in the menu by going to Appearance > Customize > Additional CSS and pasting it there.

/*Menu font color*/
@media screen and (max-width: 768px)
.main-navigation #primary-menu > ul > li > a, .main-navigation #primary-menu > li > a {
    color: black;
}

Best Regards,
Support