Page widget CSS problem in Corporate theme – please help

  • Resolved Magdalena Halford

    (@magdalena-halford)


    15 years, 1 month ago

    Hi – I am building a site using corporate theme. I added the WP “page” widget to the sidebar, and there is a problem with how the css displays the links in the sidebar. The page you are on, as well as the children pages, get highlighted in grey. This is due to the nav css rules, which are in the style sheet as:

    #nav a:hover, #nav a:active, .current_page_item a, #home .on {
    background:#4E4F53; /*mover over*/
    text-decoration:none
    }

    The problem is that I cannot figure out how to make the background rule not apply to the sidebar. I tried to write separate rules for #sidebar, but they get applied to the main nav menu too! I tried putting them in the css file, and I also tried putting them directly in the sidebar code page for that theme, but they still get applied to the nav menu. Maybe I am not writing the correct rules? I don’t really know css so I am just using triel and error. This is what I was trying to put in to get it to not be grey:

    #sidebar a:hover, a:active, .current_page_item a, #home .on {
    background:#FFFFFF; /*mover over*/
    text-decoration:none}

    I hope someone can help – I have spent hours trying to solve this little issue with no success. All I want is for the sidebar menu to not be highled in grey, but with the main top nav bar staying the way it is. You can see my problem at:

    https://www.halfordrealestate.com/?page_id=38

    Thanks,
    Magdalena

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

  • Try:
    #sidebar .current_page_item a {background:#fff;color:#00008B;}

    Thread Starter Magdalena Halford

    (@magdalena-halford)

    Excellent! That helped the grey problem!

    The only thing now is that the current page and the children pages in the sidebar menu no loger hover red (the other links still hover red). How do I add the hover red back into that?

    I appreciate this sooo much – I feel silly having spent hours instead of just posting here. New to this, after all.

    Add #sidebar .current_page_item a:hover {color:#d50000;}

    Thread Starter Magdalena Halford

    (@magdalena-halford)

    Great – it worked! You just made my day. What is so simple for some can be such a puzzle for others. ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Page widget CSS problem in Corporate theme – please help’ is closed to new replies.