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-menuThis class by default has a min-width of 10rem. To override it set the min-width in the class manager.
3 Likes
REM
EM
WTF
I’m off googling
EM is relative to the parent font size
REM is relative to the base font size
WTF is relative to the confusion 
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.
4 Likes
Thanks Malachi,
That worked!
1 Like
hi all,
sorry to bring up an old post.
I too have multiple lines on a dropdown menu.
I did what @PeteSharp has said above my typing .dropdown-menu in the class manager, and I dont get any change, but if I type this int the class manager, I do get them on a full line - but as a bullet point and its always open.
I have attached what I get.
Can someone let me know the full procedure to get my text on 1 line…do i need to apply the class manager to a certain area? and where do i change the REM? cant see anywhere to adjust…is this in the class manager i take it?
Do you have a link.
Hi @PeteSharp,
Im afraid, not as yet - only playing around with things as i’m building my site.
Tried several times and still wont do my page title on a whole line
Instead of:
Event Management
I get:
Event
Management
Or when i put the code in as my above post then I get the bullet point in.
You don’t have to add the class anywhere apart from the class manager.
Maybe try using this. Keep the spacing.
.navbar-nav .dropdown-menu
Do you have any other classes applied to the navigation??
I’m also running into the problem of my sub menu getting items divided into multiple lines. Adding .dropdown-menu as a class to the menu changes the design of the menu, and it gets a border around it (that I don’t want)… How do I sort this out? 
By starting to provide some more detailed information. Any link or images would be helpful to understand better.
Sure! It looks like in this screenshot. Instead of having Example of another menu item divided into two lines, I’d like the menu to expand to keep it in one line.
I’m not able to duplicate your challenge:
That’s very strange. Doesn’t work for me, and I’ve tried to create a new project all together to check if there’s some other code in my current project that messes with the menu, but it’s the same thing - the lines gets cut. Are you just using the default settings, no classes or anything?
I’m still note able to get it to work on my site.
Here’s a link (removed). Any ideas what the issue is?
As an alternative option just set the column width of the .dropdown-menu class:
Edit: @PeteSharp mentioned the same solution in this thread nearly 2 years ago.
1 Like