WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Navigational Menu Not Displaying Drop Down Menus (15 posts)

  1. wrcdwise
    Member
    Posted 1 year ago #

    I've been working on a new website for my company at http://www.wrc.org/wordpress. There is something wrong with the navigational menu. When I have 7 buttons displayed in my menu, it is wrapping into two rows. The top rows dropdown menus do not work correctly then. As soon as you try to click on them, they disappear. If I only use 5 menu buttons so they all display on 1 row, there is no problem. But I need the other 3. Anyone know how to fix this?

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    Can you link to a webpage with the problem?

  3. wrcdwise
    Member
    Posted 1 year ago #

    Sorry I re-added the other three pages to the menu. It displays fine in Firefox and Chrome, but some people who look at it, even on the same version of Internet Explorer see it like I described. With the dropdown menus unable to be clicked on.

  4. Andrew
    Forum Moderator
    Posted 1 year ago #

    In which version of Internet Explorer does the issue occur?

  5. wrcdwise
    Member
    Posted 1 year ago #

    That's the really strange thing. We tested it on 7 different computers today. 4 were using IE10 - 2 of them displayed without a problem, 2 of them looked as I described above. 2 were using IE 9 - 1 could see it fine, the other not. 1 was using IE8 - it was messed up. There doesn't seem to be any rhyme or reason to it.

    But when I reduce the number of pages showing in the menu, the problem goes away. The menu then displays uniformly in Firefox, Chrome and various version of IE. Any ideas?

  6. Andrew
    Forum Moderator
    Posted 1 year ago #

    Websites don't automatically work in every browser.
    Internet Explorer reads widths differently to Chrome and Firefox.

    Unless the website has been coded for particular versions of IE, don't be surprised if you find problems.

    I'll have a look now.

  7. Andrew
    Forum Moderator
    Posted 1 year ago #

    I found the issue in IE 7.0 and the solution.

    Do you have a section in the dashboard named, "Custom CSS", "Custom Styles" or "Jetpack"?

  8. wrcdwise
    Member
    Posted 1 year ago #

    Yes, in the Theme Options, there is a box you can put in Custom Css

  9. Andrew
    Forum Moderator
    Posted 1 year ago #

    In that, enter this;

    #navi {
     *clear: left;
     *width: 100%;
     *float: none;
    }
  10. Andrew
    Forum Moderator
    Posted 1 year ago #

    That should solve your 2 line problem, but looks like there are other issues when you hover on the menu.

  11. wrcdwise
    Member
    Posted 1 year ago #

    YES it did. Thank you so much!!!!! I see what you're saying about the menu still having issues though. Any ideas on that?

  12. Andrew
    Forum Moderator
    Posted 1 year ago #

    This should resolve the issue of the sub-sub menu being too far to the right;

    #nav li ul ul {
     *margin-left: 0;
     *left: 12em;
    }
  13. wrcdwise
    Member
    Posted 1 year ago #

    Thank you so so so so much!!!! I have been messing with this all day long. I greatly appreciate your help. Seems to be working now!!!

  14. Andrew
    Forum Moderator
    Posted 1 year ago #

    And this should clear up any other issues;

    #nav li ul {
     *top: 40px;
    }
  15. wrcdwise
    Member
    Posted 1 year ago #

    Thank you! Everybody is reporting it looks good now. I greatly appreciate your help!

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags