Горизонтальная прокрутка для UL

по какой-то причине, я не могу помешать ул и это Ли от упаковки. Я хочу, чтобы ширина Ул была именно шириной Li на одной строке (без упаковки), и если UL становится шире, чем Nav-div (800px), я хочу прокрутку в NAV, поэтому я могу прокрутить Li.

Я в значительной степени пробовал что-либо с дисплеем, пробелом, шириной и высотой, но я могу заставить его только работать, если я даю UL определенную ширину. Это, однако, не является опциями, поскольку страница генерируется и может содержать 1-20 Li.

Кто-нибудь знает, как сделать прокрутку, не установив ширину UL?

HTML:

<div id="nav">
     <ul id="navbuttons">
          <li>Some text</li>
          <li>Some text</li>
          ...
     </ul>
</div>

CSS:

div#nav
{
    height: 100px;
    width: 800px;
    margin-left: auto;
    margin-right: auto;
}

div#nav ul li
{
    margin-right: 15px;
    float: left;
    font-size: 12px;
    list-style-type: none;
}