[Mobile View] Reduction of Font Size of Menu Items

Started by: Himanshu Jagdish Sheth August 10, 2017 - 19:52

Please have a look at this site on the mobile device and open the menu. As seen in screenshot, the font size of the Menu Items is huge and covers half the screen size when expanded.

Can you please suggest CSS change to reduce/modify the font size of the menu item [only on mobile screen].

Thanks in advance.



Replies:

  • Author Team
    #4955 Reply

    Axel
    Hi,

    Please try to use this custom CSS:

    @media only screen and (max-width: 991px) { 
    body .mobile_header .top_nav_mobile .main_menu_nav > li > a{ font-size: 16px; }
    }

    Regards

    #4974 Reply

    Himanshu Jagdish Sheth
    Thanks, it works. Can you also provide similar change for the sub-menu items
    Author Team
    #4982 Reply

    Felix
    Hi,
    Please try to use this custom CSS:
    @media only screen and (max-width: 991px) { 
    body .mobile_header .top_nav_mobile .main_menu_nav ul li a{ font-size: 14px; }
    }

    Regards

    #5007 Reply

    Himanshu Jagdish Sheth
    Thanks Felix, works fine. Closing the ticket
    Author Team
    #5012 Reply

    Axel
    You are welcome!
You must be logged in to reply to this topic.