Menu titles are forced to multiple lines. I want 1 long title

How go you get a menu title to be on one long line and to not “return” to the next line? So for Caldwell Advantage - 7YEPP (see screenshot), I want it all on 1 one line not 3 separate lines. (Top photo is the desired effect. Bottom photo is the unwanted effect.) Thanks.

When you select your menu, make sure you aren’t using the primary menu, choose none. Mine is setup this way and the box will adjust based on what I have in there.

Alternatively, you could add a class to that list and manually set the width.

I tried created a class and changing the width, but that causes some funky side effects. As for the primary menu, the issue isn’t with that. Are there any other settings inside the custom class besides width that need to be changed? I clicked the List container in the SERVICE menu nav, then I set the width at 300px under the normal dropdown. This causes a bunch of issues such as the menu always being open and it moved way to the left of where it should be under the SERVICE dropdown.
Other thoughts?

Could you try setting the width to 100%?

A question I also need to care about, thanks for your answer.

Hi @Brett,

You don’t need to use a custom class. Just add the Bootstrap class to the class manager.

.dropdown-menu

This class by default has a min-width of 10rem. To override it set the min-width in the class manager.

2 Likes

REM
EM
WTF
I’m off googling

@apswoodwork

EM is relative to the parent font size

REM is relative to the base font size

WTF is relative to the confusion :rofl:


an example. If a parent font size was 14px, the child font size of 1em would equal 14px. 2em would be 28px.

The same for REM, but it scales its size from the root font size of the entire site.

1 Like

Thanks Malachi,
That worked!

1 Like