You’re using an element that comes with quite some predefined parameters, that you can’t override from the UI.
For instance, all those elements:
.w-dropdown-btn, .w-dropdown-toggle, .w-dropdown-link
have a default white-space value that tell them to avoid wrapping
white-space: nowrap;
So you need to override that property.
Give a class to everyone of your TEXT elements within the dropdown toggle. For example .ddown-toggle-text
Now add the following custom code to the <head> custom code box:
/* make the dropdown toggle text goes to next line */ .ddown-toggle-text { white-space:normal !important; }
Publish and test online, because it won’t show-up in the Designer.
If it doesn’t work, or works funny, try the following code instead:
/* make the dropdown toggle text goes to next line */ .ddown-toggle-text { white-space:normal !important; word-break:break-all; }