[Resolved] Secondary Navigation Sub Sub-Menu Width

Home Forums Support Secondary Navigation Sub Sub-Menu Width

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #110066
    Mary Pearson

    Is it possible to have the main navigation one width but the sub-menu and sub sub-menu widths different?

    Website in question is http://plantbest.info/

    Under Horticultural Products I have a sub-menu with COIR, BAMBOO and APPENDIX which doesn’t require very much width. I would like to make it narrow so that I can make the sub sub menus wider.

    Is this possible?

    Thanks!

    #110106
    Tom
    Lead Developer
    Lead Developer

    You’ll have to use CSS to target each level of sub-menu.

    First level:

    .secondary-menu > li > ul

    Second level:

    .secondary-menu > li > ul > li > ul

    And so on..

    That should do the trick.

    #110245
    Mary Pearson

    As usual this is the perfect answer. Thank you so much Tom.

    Now just to make it a little more difficult, is it possible to have different widths for each of the sub-menus in the secondary navigation – i.e. Under Horticultural Products

    .secondary-menu > li > ul {
    width:120px !important;
    }

    .secondary-menu > li > ul > li > ul {
    width:320px !important;
    }

    .secondary-menu > li > ul > li > ul > li > ul {
    width:330px !important;
    }

    but Under Retail Products

    .secondary-menu > li > ul {
    width:320px !important;
    }

    .secondary-menu > li > ul > li > ul {
    width:500px !important;
    }

    I thought I would be able to put the .menu-item- number in front but that just negates the good changes that are working with your code.

    Thanks again!

    #111337
    Tom
    Lead Developer
    Lead Developer

    You’ll have to inspect the elements and find the specific menu item IDs for each item to specifically target them. The classes should be in the <li> elements and look something like: menu-item-123

    #111444
    Mary Pearson

    Thanks Tom. I had the right idea but needed to correct a few things. Your input helped greatly. Much appreciated!

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.