Header Navigation

  • Why won’t my sub menu items stay highlighted for the current page?

    Why won’t this code work?

    #header ul.nav li li.current-menu-item a,
    #header ul.nav li li.current-cat a,
    #header ul.nav li li.current_page_item a,
    #header ul.menu li li.current-menu-item a,
    #header ul.menu li li.current-cat a,
    #header ul.menu li li.current_page_item a {
    color: #165B94;
    font-size: .85em;
    font-weight: bold;
    background-color: #133C69;
    }

Viewing 4 replies - 1 through 4 (of 4 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    It could be overridden by somewhere else in your stylesheet, or the CSS selectors could be mismatching.

    Thread Starter IkeGordon

    (@ikegordon)

    How can I find the correct CSS selectors. I’ve tried everything. Seems to work fine for the main navigation but fails to affect the sub menu.

    Here’s main navigation code

    #header ul.nav .current_page_item a,
    #header ul.nav .current-cat a,
    #header ul.nav .current-menu-item a,
    #header ul.menu .current_page_item a,
    #header ul.menu .current-cat a,
    #header ul.menu .current-menu-item a {
    color: #165B94;
    }

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Are you using a browser inspector tool like Firebug, or Chrome’s Inspect Element tool?
    If so, double-check the class names on the sub-menu selected items to find whether you’re misspelling the selectors.

    Thread Starter IkeGordon

    (@ikegordon)

    Well that wasn’t easy but I got it! Thanks Andrew! I learned a lot in the process.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Header Navigation’ is closed to new replies.