无法水平列出UL水平溢出（和滚动）

我想获得一个无序列表水平列出（用float：左），但它拒绝水平溢出。相反，它会自动在下一行（进而溢出，甚至溢出-Y：？没有，它会自动创建一个垂直滚动条的任何想法无法水平列出UL水平溢出（和滚动）

<style type="text/css"> 
    ul { 
     height:15px; 
     width:400px; 
     overflow-y:none; 
     overflow-x:auto; 
    } 

    li { 
     float:left; 
    } 

</style> 

<body> 
    <div> 
     <ul id="someList"> 
      <li>element 1</li> 
      <li>element 2</li> 
      <li>element 3</li> 
      <li>element 4</li> 
      <li>element 5</li> 
      <li>element 6</li> 
      <li>element 7</li> 
     </ul> 
    </div> 
</body>

来源

2011-06-28 achow

我可以问在什么情况下您想在无序列表上使用水平滚动条吗？ – Zoidberg

如果我理解正确的话，这应该是它：

http://jsfiddle.net/Uyc8d/

我切换到display: inline-block（而不是float: left），和我使用white-space: nowrap防止缠绕。

ul { 
    width: 400px; 
    overflow-x: scroll; 
    background: #ccc; 
    white-space: nowrap 
} 

li { 
    display: inline-block; 

    /* if you need ie7 support */ 
    *display: inline; 
    zoom: 1 
}

来源

2011-06-28 22:29:23 thirtydot

我的印象是先生。 – Zoidberg

谢谢你，先生。令人印象深刻。 – achow

white-space：nowrap;帮助我，谢谢！ –

无法水平列出UL水平溢出（和滚动）

回答

相关问题