Mega Menu Font options

[hellojonesie]

Hi!

I just enabled the mega menu on my site, and I love it, but I’d like to use the exact same font all over (for the mega menu column titles + for the different tabs themselves). I’d like to use the Menu Font that is currently in place for my header bar/main menu with that size, letter spacing, etc. (See screenshot)

Any ideas?
Thanks!
Amy

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

li.menu-item.sf-mega-menu > ul.sub-menu > li.menu-item > a, li.menu-item.sf-mega-menu > ul.sub-menu > li.menu-item > span.title,li.menu-item.sf-mega-menu ul.sub-menu li.menu-item > a{
font-family: Montserrat  !important;
letter-spacing: 2px !important;
font-weight: 700 !important;
font-style: normal !important;
font-size: 11px !important;
}

Thanks
Mohammad

[hellojonesie]

Hi Mohammad, thanks !

I tweaked the letter spacing a bit so that everything would fit on one line so this is the code I used finally:

li.menu-item.sf-mega-menu > ul.sub-menu > li.menu-item > a, li.menu-item.sf-mega-menu > ul.sub-menu > li.menu-item > span.title,li.menu-item.sf-mega-menu ul.sub-menu li.menu-item > a{
font-family: Montserrat !important;
letter-spacing: 0px !important;
font-weight: 700 !important;
font-style: normal !important;
font-size: 11px !important;
}

Is there anyway as well to make it so the column titles are bolded whereas the tabs such as “originals” “pins” “banners” are thinner/not bolded ? (See screenshot)

Thanks!

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-
li.menu-item.sf-mega-menu > ul.sub-menu > li.menu-item > a{
font-size:14px !important;
}
Thanks
Mohammad

[hellojonesie]

Hmm that doesn’t seem to do anything at all.. Also, why does it say font size 14px? I am not looking to make the font larger, I am looking to UN-bold the sub categories under “Hello Jonesie” “Do it Yourself” & “And More!”

Thanks!

[Mohammad – SUPPORT]

Hi,
Just try this code:-

li.menu-item.sf-mega-menu ul.sub-menu li.menu-item > a{
font-weight:normal !important;
}

Thanks
Mohammad

[hellojonesie]

That worked, thank you !! 🙂

[Mohammad – SUPPORT]

Hi,
Glad 🙂 to help you.
Thanks
Mohammad