Forums

Get help. Give help. A Web Design and Development Community.

[Solved] FireFox problem: nested menu not relative to parent li

  • # September 21, 2013 at 9:53 am

    This is FF issue, (it looks fine on safari and chrome) The nested menu shows up all the way on the left and not right under the selected item…

    please help…thanks!

    # September 21, 2013 at 10:03 am

    I dislike all those deep selectors (nav ul li ul li a)…I just give each menu level itsown classand it makes things much clearer.

    Here’s a reference version I keep around.

    Hope it’s useful: http://codepen.io/Paulie-D/pen/22c4ca602bda363099133ded6bca2294

    EDIT:

    Try adding left:0; to the submenu css.

    # September 21, 2013 at 10:12 am

    Thanks Buddy, does look simpler..

    # September 21, 2013 at 10:15 am

    ahh…that actually worked!
    left:0;

    Updated Pen:
    http://codepen.io/hrazith/pen/xumrd

    PS: how do I mark this thing ‘solved’?

    # September 21, 2013 at 3:17 pm

    This reply has been reported for inappropriate content.

    You should not be giving width to your dropdown ul like this:

    nav ul ul { 
      width: 240px; <--replace 240px with width:auto or you can remove it completely  
    }
    

    Let that width of dropdown grow on it’s own according to anchor content width with this:

    nav ul ul li a {
      padding:8px;
      white-space:nowrap;
    }
    
    # September 21, 2013 at 6:52 pm

    i like it!…

    Thanks

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

We have a pretty good* newsletter.