menu problem

  • Resolved carlsandburg

    (@carlsandburg)


    10 years, 4 months ago

    anybody have an idea on how to solve this problem? The upper menu item is obscured by the text in the second row.

    http://cchca.stevelescure.net/

    hover of “Civic Association” to see what i mean.

    i tried changing the ccs of the menu background to black, but the text sill bleeds thru. i can change it to white, but that’s ugly.

    any thoughts?

    thanks

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

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    10 years, 4 months ago

    Don’t give your menu items a z-index of 999 – The <li>s shouldn’t have a z-index at all.

    Thread Starter carlsandburg

    (@carlsandburg)

    10 years, 4 months ago

    thanks for giving me something to try. – i’m a newbie with this…

    i changed

    .pagesmenu ul li ul{
    position: absolute;
    left: 0;
    display: block;
    visibility: hidden;
    background: #000;
    zindex:9999
    }

    to this… made no difference

    .pagesmenu ul li ul{
    position: absolute;
    left: 0;
    display: block;
    visibility: hidden;
    background: #000;
    }

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    10 years, 4 months ago

    What theme are you using?
    Btw I was referring to the <li>s

    Thread Starter carlsandburg

    (@carlsandburg)

    10 years, 4 months ago

    Sorry, i’m probably not understanding. this is my first time getting into css, at least this much.

    I’m using Expressivo

    http://themocracy.com/2010/02/expressivo-center-free-wordpress-theme/

    i included more of the CSS below if that helps.

    .pagesmenu ul li ul{
    position: absolute;
    left: 0;
    display: block;
    visibility: hidden;
    background: #000;
    z-index:999;
    }

    .pagesmenu ul li ul li{
    display: list-item;
    float: none;
    }

    .pagesmenu ul li ul li ul{
    top: 0;
    }

    .pagesmenu ul li ul li a{
    width: 160px;
    padding: 5px 8px;
    margin: 0;
    border-top-width: none;
    border-bottom: 1px solid #777;
    border-right: 0 !important;
    }

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    10 years, 4 months ago

    Install this plugin http://wordpress.org/plugins/custom-css-manager-plugin/

    Then use its section of the dashboard to hold this modification:

    .pagesmenu ul li {
 z-index: auto;
}

    Btw we don’t support your theme, so you need to get into contact with the people who gave it to you or made it.

    Thread Starter carlsandburg

    (@carlsandburg)

    10 years, 4 months ago

    WOW! that did it. Thank you so much, this really, really helped me. Can you take a few minutes more and tell me why this worked? i understand that z-index controls what overlays what (i might be not saying that right). but why would z-index: auto fix me problem?

    thanks again!

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    10 years, 4 months ago

    It’s not necessarily a fix, you need to talk to your theme’s author and ask why this style was applied to the ‘<li>‘. There may well be a reason that you’ve just overridden.

    Thread Starter carlsandburg

    (@carlsandburg)

    10 years, 4 months ago

    understood. definitely on the right track anyway. will do. thanks again

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘menu problem’ is closed to new replies.

Tags