Menu issues

  • cghagge · Member ·

    We have three Scouting groups on our overall Scouting 141 website (scouting141.wordpress.com serves Cub Scout Pack 141, Boys’ Troop 141, Girls’ Troop 141), and I’m running into some menu issues.

    1. The width of the dropdown menus is suddenly changing with each menu item (it didn’t do this a few weeks ago). Some menu text that fit before is being split into two lines, some are running into the right arrows, and the white background for each menu item varies. How can this be fixed?

    2. With lots of pages for each of them, there are a lot of menu elements. In desktop and tablet views, the menus drop down and expand just fine. However, in the phone view, the hamburger menu shows every single menu item at once in causes navigation issues. Is there custom CSS that can turn the phone/mobile menu into an expandable/accordion format?

    Thanks!

    The blog I need help with is: (visible only to logged in users)

  • themegrill · Theme Author ·

    Hi @cghagge,

    1. Please add the following CSS. 

    .main-navigation ul ul a {
    min-width: 250px;
}

    You can increase the 250px value as per you need.

    Also, if you like, you can add the following CSS for the 3rd level menu of ‘Scouts BSA Girls Troop 141‘ menu to be shown in the left side (currently as it is showing in right side it is going out of screen if screen are smaller width)

    .main-navigation ul li:last-child ul ul {
    right: 100%;
    left: auto;
}

    2. Sorry, this is not achievable just via CSS, if it would have been I would certainly have provided it. It needs JS, CSS and some PHP coding as well. We will think about adding this in version update.

    Thanks.
    Sanjip S.

  • cghagge · Member ·

    That helped greatly with the overall formatting. Thank you!

    Hopefully a collapsible mobile menu will happen someday soon. Until then, I’ll just have to live with it (and see about combining some pages).

    Thanks again for your support!

  • cghagge · Member ·

    And that was a great idea to shift the Girls’ Troop menu to the left. Thanks!

  • themegrill · Theme Author ·

    You are welcome. :)

    Thanks.
    Sanjip S.

  • The topic ‘Menu issues’ is closed to new replies.