make <ul> fit width of <li> links

css, html, overflow

Solution

When you say Which results in my links jumping lines I guess is breaking in a new line, then you can use this property to avoid that:

.menu ul li {
   white-space:nowrap;
}

Also to make your `ul` get the full `width` change his display property:

.menu ul {
   display:inline-block;
}

The demo http://jsfiddle.net/5KSaM/7/

Problem

I have a div with `overflow-x:scroll;` and in that div I have a list, and that list have some links. But I don't seem to be able to make my list a wide as its links. Which results in my links jumping lines. How would I fix this? My html ``` <div class="menu"> <ul> <li> <a href="#">a long text that jumps lines</a> </li> <li> <a href="#">a line that don't jump</a> </li> </ul> </div> ``` My CSS ``` .menu{ width:400px; overflow-x:scroll; } ```

Original source