Support » Themes and Templates » Navigational Menu Help

  • crystalclearimagedesign

    (@crystalclearimagedesign)


    working with a template (Ideal Theme) where I’m attempting to solve the problem of a drop down menu for the following site:

    http://www.communityrule.org/blogsite

    …in the Stylesheet (style.css), the script coding for the navigation menu looks like what I’ve pasted below

    /*- Top Nav -*/
    .topnav { float:right; width:450px; margin:50px 0 0 0; padding:0; background:#4d4d4d; border:1px solid #707070; }
    .topnav ul { float:left; list-style:none; padding:0; margin:0; }
    .topnav li { float:left; padding:0 5px; }
    .topnav li a { font:normal 12px Arial, Helvetica, sans-serif; color:#fff; display:block; float:left; padding:10px; }
    .topnav li a:hover { background:#2c2c2c; }
    .topnav li.current_page_item a { background:#2c2c2c; }

    what in this script would need to changed to get the drop down effect I’m needing for this navigational menu?

    Thanks!

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

    (@anevins)

    Try a CSS-specific forum for CSS-specific help.

    WPyogi

    (@wpyogi)

    Where did your theme or site come from?

    crystalclearimagedesign

    (@crystalclearimagedesign)

    http://www.templateaccess.com

    very “generic” support help
    which is why I came here

    alieneila

    (@alieneila)

    You’re not handling hiding the sub list. You have to hide ul.children and then only display it when its parent li is being hovered over. The code below isn’t 100% perfect, but if you add it to your css you’ll get the idea.

    ul.children {
        display: none;
    }
    .topnav li {
        position: relative;
    }
    .topnav li:hover ul.children {
        background: #c0c0c0;
        display: block;
        position: absolute;
        top: 25px;
        width: 250px;
        z-index: 1000;
    }
    .topnav li li,
    .topnav li li a {
        display: block;
        width: 100%;
    }

    Moderator Andrew Nevins

    (@anevins)

    WordPress forums do not support commercial themes.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Navigational Menu Help’ is closed to new replies.