水平滾動條和禁用垂直滾動條

Question

如何添加水平滾動條？

（禁用了對自定義滾動條先跟）

http://jsfiddle.net/s5ng001z/13/

HTML

<div style="height:70px; width:200px"> 
    <div class="scrollbar_content scrollbar-inner"> 
    <div class="box"></div> 
    <div class="box"></div> 
    <div class="box"></div> 
    <div class="box"></div> 
    <div class="box"></div> 
    <div class="box"></div> 
    <div class="box"></div> 
    <div class="box"></div> 
    </div> 
</div> 

CSS

.scrollbar_content { 
    height:100%; 
    width:100%; 
    min-width:100%; 
    overflow-x:scroll; 
    overflow-y:hidden; 
} 

.box { 
    display:inline-block; 
    margin:2px; 
    background:red; 
    height:50px; 
    width:50px; 
} 

Answer 1

你需要這種風格white-space: nowrap;添加到.scrollbar_content http://jsfiddle.net/s5ng001z/14/

.scrollbar_content { 
    height:100%; 
    width:100%; 
    min-width:100%; 
    overflow-x:scroll; 
    overflow-y:hidden; 
    white-space: nowrap;  // add this 
} 

.box { 
    display:inline-block; 
    margin:2px; 
    background:red; 
    height:50px; 
    width:50px; 
}