Isolating the ID of a specific nav link in Wordpress

I'm trying to change the color of a specific menu item using the #ID but when I inspect the element the of the "Veterans" link on my site:

http://hiltondesign.net/NETZEROPLUS

The ID it offers (menu-item-290) doesn't help me change the color using css. Can you help me discover the ID that will help me change the color of the menu item and if you're feeling generous, offer an explanation as to how I can do it on my own in the future?

Best Regards,

Ian

  • Timothy Bowers

    Hey there,

    Lets get you sorted :slight_smile:

    You didn't really say how you wanted to change it. Do you:

    Want the link colour changing?
    want to change the background colour changing?
    Or some borders adding?

    You were on the right track with the menu ID there, something like this should work:

    #menu-item-290 a {color:#000;}

    However, there is some CSS which is more specific and taking priority so we instead do this:

    #megaMenu ul.megaMenu li.menu-item #menu-item-290 a span {color:#000;}

    This will get what you need, just change the ID as you wish to target another menu item.

    If it were a border you could do this:

    #megaMenu ul.megaMenu li.menu-item #menu-item-290 a span {border: 1px solid #000;}

    Or you could target the container for the anchor like:

    #megaMenu ul.megaMenu li.menu-item #menu-item-290 {border: 1px solid #000;}

    Hope this helps, have a great day! :slight_smile:

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.