links color

• 

  lulu13 · Member · Feb 1, 2016 at 5:25 pm

  • Copy link
  • Add topic to favorites

  Hello,

  I know the CSS code to change links color and backgrounds, but I can’t figure out how to change the color of my links in the menu only. I’d like to have a menu with a black background and white links, that would change to a yellow background with black font on hover. However, it seems like when I try to change the link color, all my links change color and I don’t want that. I tried to use the “inspector” to figure out the correct codes but was sadly unsuccessful. Thanks for your help.

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Feb 2, 2016 at 2:05 am

  • Copy link

  Hi there, you are actually pretty close with what I see in your custom CSS. Change .nav-menu a to the following

  .main-navigation li a {
      font-size: 12px;
      padding: 0 5px;
      color: #fff;
  }

  and change your .nav-menu rule to have a black background color, like this.

  .nav-menu {
      background-color: #000;
  }

  I see an orange text color on hover right now. To have a yellowish background and black text on hover, add the following.

  .main-navigation li a:hover {
      color: #000;
      background-color: #ffff33;
  }

• 

  lulu13 · Member · Feb 2, 2016 at 4:44 am

  • Copy link

  Thanks a lot! I was missing the li :)

• 

  thesacredpath · Member · Feb 2, 2016 at 5:03 am

  • Copy link

  You are welcome, and we all miss things like that from time to time. :)