Can't style dropdown menu

So I have a large dropdown menu with +10 items. As standard, the menu is too large to fit on the screen, so I want to simply make the link text size smaller. However, I can’t seem to make it work. I’ve browsed through the forums and YouTube for a couple of hours now and whatever is suggested there, doesn’t seem to work.

Here’s what I’m trying to do:


But I can’t see any changes when I preview it in my web browser (chrome). Also colour changes do nothing.

But, when I click the italic option in the class manager, that does work for whatever reason.

So now I’ve come to think this is some kind of bug within Blocs or an I doing something wrong?

Thanks,
Carlo

Hey @carlo

The following class should work fine (no a). Add it to the class manager and then change the font size.

.dropdown-menu 

You could look at a mega menu option for such a large menu, eg the drop-down had multiple columns.

Thanks for your quick respons!
I’ve tried what you said but that too didn’t seem to work. I did the italic test again, and that did display in my browser test… Any other styling I try to do doesn’t come through.

EDIT: Other styling does come through. I can change the border css for example, but text size doesn’t do anything… the only thing I need it to do won’t work, frustrating :crazy_face:

That’s weird. Is there a live version of this site to have a look at ?

Not yet no. I can send it too you if you like?
I’ve just changed the overall size of the nav as a temporary fix, that changed the size of the dropdown as well.

1 Like

Ok, I’ll have a look.

Hi @carlo,

Go to Project Settings, change the style of navigation links in Typography settings, then you will have navbar li a class in Class Manager. You can edit it from there.

If you only want to edit the links in dropdown menu, select the list in dropdown menu, and set the source of the menu to ‘none’, which will make it fully customizable with any classes.

That’s interesting @Eldar. I always have the menu source set to none. So if you’re using the menu system, that effects custom classes??

I always use the menu set to none as well, because I like it to be more flexible (for example, I can set an interaction scroll to target without messing with the scrolling effect). If the source is net to primary menu, you need to edit the default class, which means all of your links will be affected.

1 Like

Surely You can over ride the default class with the class manager though? I haven’t used the primary menu source since Blocs 2 when I first started out with it.

Actually, yeah I think we can do that by selecting the individual menu items using Layer Tree and applying the custom class to override the default class. I think in Blocs 2 it was not possible, and we could only add class to the nav list. Maybe I remember wrong.

In any case, I like to use ‘none’ over primary menu any day!

I’m with you on that.

Hi @Eldar ,

Thanks for replying!
I’ll try it your way this weekend and I’ll report back.