Changing menu text colour

  • Hiya, I’ve put a colour behind the top menu and the main menu, but now I’d like to chance the text colour to make it stand out. Anyone know how I go about this?

    Really appreciate any help, I’m still learning!

    Thanks

Viewing 4 replies - 1 through 4 (of 4 total)

  • It’s always helpful if you can include a link to your site so we can examine it. Thanks.

    Thread Starter bewildereddad

    (@bewildereddad)

    Good point!

    It’s https://www.jimcoulson.com

    It’s in a bit of disarray whilst I experiment, but you can see the menus on the front page – I need the text on them in white really. Any ideas much appreciated.

    In your custom CSS, add these two rules:

    #top-navigation li a,
#main-navigation li a {
   color: #fff;
}
#main-navigation li.current_page_item > a,
#top-navigation li a:hover,
#main-navigation li a:hover {
   color: #fff;
   font-weight: 700;
}

    The first rule changes the default color of the menu text to white. The second rule changes the color of the current menu item, as well as any menu item that is hovered with the mouse, to white. There’s an additional property (font-weight) that makes them bold. You can add or remove properties for that second rule as you wish. For example, instead of making the text bold, you might want do add an underline instead.

    Thread Starter bewildereddad

    (@bewildereddad)

    Thank you so much. Really appreciate that.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Changing menu text colour’ is closed to new replies.