Top Navigation Bar Single Line List Item

Question

I've looked at other posts on this and I did everything I could to display my two lines multiple words into a single line.

"Financial and Budget Management" and "SharePoint Development and Management"

When I hover it, it shows as single line so I guess on my code the hovering is doing magic? But what I want is to have the list items to be displayed in a single line.

I tried adding "width: auto !important; and white-space: nowrap;" inside .ms-core-listMenu-horizontalBox {

But it did not work.

What makes a long list to appear on a single line..?

Thank you in advance...!

Answer 1

What we use to prevent wrapping is the following CSS inside the header of our master page:

ul.dynamic {
    width: auto !important;
    white-space: nowrap;
}