Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • April 8, 2015 at 12:36 am #425014
    vailjazz

    Hi,

    I’m trying to change the menu sizes at various breakpoints and am frustratingly realizing that I cannot figure out how to isolate different menu items to change their font sizes.

    I can change the overall menu font size (which changes the top menu and the submenu/dropdowns) and set a different size for the megamenu titles, but what I want to do is to set three distinct groups with different font sizes:

    • GROUP A: top menu (only!)
    • GROUP B: megamenu title links (only!)
    • GROUP C: submenu/dropdown links for both standard menu items and megamenu items

    Can you please help me figure this out?

    Thanks!

    April 8, 2015 at 5:43 pm #425472
    Elliott

    Hey vailjazz!

    For group A and C you can do this in Dashboard > Enfold > Advanced Styling.

    For the mega menu titles use this CSS.

    .mega_menu_title { font-size: 16px !important; }

    Cheers!
    Elliott

    April 8, 2015 at 9:03 pm #425596
    vailjazz

    Hi Elliott,

    I actually need to do it through CSS (need to identify the appropriate CSS path for each element) so that I can set them to different sizes at different device breakpoints.

    Like I said, I’ve had partial success with this but can’t seem to isolate each group on it’s own when I change the font size.

    Thanks again!

    April 9, 2015 at 5:28 pm #426090
    Yigit

    Hey!

    You can change the code to following one 

    #menu-item-35 .mega_menu_title { font-size: 16px !important; }

    That would change the font size of mega menu titles under Support menu item. You can right click on Chrome or Firefox to inspect elements to find menu item ID’s http://i.imgur.com/HyPTCRg.jpg

    Regards,
    Yigit

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