Using icons for top level menu items

  • ssneumann

    (@ssneumann)


    10 years, 5 months ago

    I will try the beta of the new version to see if there are options to fix this but here is what happens.

    I thought I did such a good job creating this funky cool menu for our visitor guide… but when the breakpoint kicks in on mobile devices, you click the menu button and all the icons are left justified and overlapping each other.

    I would like to maybe have the option of having text only when the mobile menu is active. Any ideas?

    http://columbiavalley.com

    https://wordpress.org/plugins/megamenu/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter ssneumann

    (@ssneumann)

    10 years, 5 months ago

    Note that I am using Jetpack Mobile Menu right now until I fix this. So, you’ll have to reduce the size of your desktop screen in order to see what happens on mobile.

    Plugin Author megamenu

    (@megamenu)

    10 years, 5 months ago

    Hi ssneumann,

    Thanks for the link.

    Unfortunately it’s not possible to change the icon size on mobiles using CSS, nor is it possible to display the menu item text (the text is stripped from the HTML when the menu is output). I think the only option really is to increase the item height to allow the icons to fit. To do that please add the following to the Custom Styling area of your menu theme:

    @media only screen and (max-width : $responsive_breakpoint) {
    #{$wrap} #{$menu} > li.mega-menu-item > a.mega-menu-link {
        height: 75px;
        line-height: 75px;
    }
}

    PS as a pro customer you can create support tickets using the form on https://www.maxmegamenu.com/support . I check those tickets much more often than the free forums here, so you will get a quicker response 🙂

    Regards,
    Tom

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Using icons for top level menu items’ is closed to new replies.