I'm implementing a menu based on this one:

<http://www.jankoatwarpspeed.com/post/2009/01/19/Create-Vimeo-like-top-navigation.aspx>

([Demo](http://www.jankoatwarpspeed.com/examples/vimeo_navigation/))

The menu uses a UL / LI structure and CSS for appropriate rendering.

The trouble is, if the browser is not wide enough, the main menu items wrap.

![Menu wrapping](https://i.stack.imgur.com/W0eFt.png)

I have surrounded the menu in a DIV.

When I apply 

```
overflow-x: auto;

```

to that DIV, mousing over a menu item causes scroll bars to appear around the DIV (presumably to accommodate the drop down menus).

How can I prevent the DIV from wrapping while retaining the drop-down menus?