使<ul>适合<li>链接的宽度

Question

我有一个div,overflow-x:scroll;在那个div我有一个列表,那个列表有一些链接.但我似乎无法将我的列表作为其链接.这导致我的链接跳线.

我该如何解决这个问题？

我的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>

我的CSS

.menu{
   width:400px;
   overflow-x:scroll;
}

Answer 1

当你说我的链接中的哪个结果跳线时我猜是在一个新行中,那么你可以使用这个属性来避免:

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

还要让你ul完全width改变他的显示属性:

.menu ul {
   display:inline-block;
}

演示http://jsfiddle.net/5KSaM/7/