Disable top navigation drop down menu wrapping

I’ve seen some posts that look to be related to my issue but I’ve yet to be successful in my task.

What I’m trying to do is expand the top navigation drop down menu so items on it do not wrap. This is currently what it looks like:

Image may be NSFW.
Clik here to view.

I would like it so that the Human Resources link, and other like it, doesn't wrapp

I’ve tried the methods posted in

http://social.technet.microsoft.com/Forums/sharepoint/en-US/8963aab5-29bf-4fa7-a310-6f96ca8c3da5/sharepoint-2013-global-navigation-menu-problem-on-publishing-page

and in

http://social.technet.microsoft.com/Forums/sharepoint/en-US/8e66370e-b376-443f-952b-db728d685fed/sharepoint-2013-global-navigation-drop-down-menu-text-overlaps-box-in-google-chrome?forum=sharepointgeneral

but nothing seems to change it.

Now, I don’t have a problem playing with the CSS files but I’m not a programmer. So, it could be that I wasn’t adding code in the correct place. Here’s how I went about it:

I opened the site in IE and hit f12 to open the developer window. I then clicked on the CSS tab and downloaded a copy of the default CSS. I tried various code from the links above by adding it to the bottom of the CSS file. I then uploaded the CSS to the same location as the master page. I edited the master page properties so my custom CSS was set as the default CSS. I made sure everything was published and approved.

So, I don’t know if I’m pointed in the right direction on this of if I’m way off base.  Any help would be greatly appreciated.

Thanks for your time,

Bill