Hello,
Sorry if this topic has already been addressed.
I am looking for a way to adjust the width of my dropdown menus to avoid having a page title split onto two lines. Below is an example of what I’d like to avoid :
Is there a way to achieve this? Perhaps with some CSS code?
Thank you!
Hey @Francois, you can use some CSS to achieve this:
Set a custom width (e.g. 300px)
/* Increase the width of the dropdown menu */
.knHeader__menu-dropdown-list {
width: 300px;
}
OR
Remove max width and text wrapping (warning: this may impact mobile menu viewing)
/* Remove the max width from the dropdown menu */
.knHeader__menu-dropdown-list {
max-width: unset !important;
}
/* Prevent text wrapping on dropdown menu links */
.knHeader__menu-dropdown-link {
white-space: nowrap;
}
Before:
After:
Let me know how you go!
2 Likes