change of color of one menu item big brother theme

• 

  darrylcotton · Member · Sep 30, 2015 at 3:48 pm

  • Copy link
  • Add topic to favorites

  hi
  I am trying to change only one menu item in big brother so that it stands out amongst all the other menu items. is this possible with the big brother theme?
  I want to see how the menu item called ‘Donate’ looks in red and possibly bold, but not sure yet.
  Thanks
  Darryl

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

• 

  thesacredpath · Member · Sep 30, 2015 at 7:23 pm

  • Copy link

  Hi Darryl, with the green menu, red, as you see, becomes difficult to read, but you can edit the color and see what you can come up with.

  #menu-item-226 a {
      color: red;
      font-weight: bold;
  }

  Another possibility would be to keep it white and make it a larger font size with all caps using the following.

  #menu-item-226 a {
      font-size: 120%;
      text-transform: uppercase;
      font-weight: bold;
  }

• 

  darrylcotton · Member · Oct 1, 2015 at 5:55 am

  • Copy link

  Thanks very much! This worked perfectly :)

• 

  thesacredpath · Member · Oct 1, 2015 at 8:28 am

  • Copy link

  You are welcome.

• 

  taapsir · Member · Oct 2, 2015 at 11:21 pm

  • Copy link

  hi sacredpath,
  how can i change the color of all the menu items to the default 000 color (as it is for the body of my website)?
  Thanks!
  the website is taapsiramchandani.com

• 

  thesacredpath · Member · Oct 3, 2015 at 9:08 am

  • Copy link

  Hi @taapsir, this thread is for the Big Brother theme, and you are using Gateway, and when you are using a different theme, please start a new thread in the CSS forum. In this case though, the CSS to change the menu item color would be the same.

  This changes all but the current menu item color.

  .main-navigation a {
      color: #000;
  }

  And this would change the current menu items color. In general it is a good idea to differentiate the current menu item from the others to help visitors know where they are on your site, but you can change the color to anything you wish, including black.

  .main-navigation .current_page_item > a, .main-navigation .current-menu-item > a, .main-navigation .current_page_ancestor > a {
      color: #000;
  }