CSS問題的X滾動條

Question

CSS：

#exposoures ul{padding:0px;margin:0px;float:left;} 

HTML：

<div id="exposoures" style="width: 100px;height:50px; overflow-x:scroll;overflow-y:hidden; background-color: #ccc;"> 
    <ul> 
     <li>row 1 col 1</li> 
     <li>row 2 col 1</li> 
     <li>row 3 col 1</li> 
    </ul> 
    <ul> 
     <li>row 1 col 1</li> 
     <li>row 2 col 1</li> 
     <li>row 3 col 1</li> 
    </ul> 
    <ul> 
     <li>row 1 col 1</li> 
     <li>row 2 col 1</li> 
     <li>row 3 col 1</li> 
    </ul> 
    <ul> 
     <li>row 1 col 1</li> 
     <li>row 2 col 1</li> 
     <li>row 3 col 1</li> 
    </ul> 
</div> 

這裏我上面包含多個ULS現在問題overflow-x:scroll股利。我無法獲得滾動條x-axis ..任何人都可以幫我解決這個問題

Answer 1

這是因爲單詞被封裝，所以當它達到寬度限制時，它只是流向下一行，由於overflow-y: hidden規則而被隱藏。

爲了避免包裝添加white-space:nowrap;到DIV：

#exposoures { white-space:nowrap; } 

活生生的例子：http://jsfiddle.net/PqR5x/1/