How to Highlight One Parent Link in Menu?

Forums Forums Menus How to Highlight One Parent Link in Menu?

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #1605
    zumghalli
    Member

    Using the Multi-level Navigation Plugin and I’m not sure if this is a plugin CSS question or WordPress CSS question.

    In my navigation bar say I have:  Home | About Us | Donate | Contact Us
    Say the entire menu background is white and when I hover over a parent link like "About Us" the background color over the parent link changes to grey.

    How can set it up where the background color of only the "About Us" link is ALWAYS red and its text color is ALWAYS white…but the rest of the menu operates as normal? So the "About Us" active, inactive, hover, visited states are always red background & white text. I essentially want to make only the "About Us" link stand out from the rest of the navigation links.

    Code:
    #9037
    tweak64
    Member

    I would like to know something similar. I would like to have current links display a different behaviour than the rest of the menu – much like the pixp point menu on this page currently the support item is styled with a filled circle.

    I know how to do this in regular css using a" li.current a" selector and then manually setting the specific list item to have a class of current on each specific page.

    What I am not sure of how to do is to set the css  up to work with the wordpress plugin. I had a look at the css for this page and see the code using "#nav li.current_page_item a" seletor is the .current class dynamically applied to the menu list items for the appropriate page?

    Thanks,

    Leslie

    #9038
    ottomek
    Member

    Yes I would like to do this same thing, not sure how though

    #9039
    ottomek
    Member

    Not sure if my CSS is completely correct but I got it to work by adding this:

    [code:1dpiq11y]#suckerfishnav .current_page_parent a{
        color:#b35804;
        font-size:13px;
        font-family: Verdana, Geneva, sans-serif;
        font-weight: normal;
        }[/code:1dpiq11y]

    It’s the [code:1dpiq11y].current_page_parent a[/code:1dpiq11y] that I styled to change the link text color to orange #b35804

    I also added [code:1dpiq11y].current_page_parent a[/code:1dpiq11y] to my hover background color state so the active parent would look the same as my hover.

    Not sure if I explained that in a manner that makes sense? I guess it would depend no how you set up your nav menu.

    John

    #9040

    Hi,
    Sorry for the ridiculously long wait time before I have replied.

    "zumghalli" wrote:
    How can set it up where the background color of only the "About Us" link is ALWAYS red

    You need to target that particular list item via it’s class or ID.

    "tweak64" wrote:
    I would like to know something similar. I would like to have current links display a different behaviour than the rest of the menu – much like the pixp point menu on this page currently the support item is styled with a filled circle.

    WordPress users .current_page_item .current_category_item and .current-menu-item to mark various types of list items as the current one.

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.