爲什麼我在這個div中獲取滾動條？

我已經設置了溢出，因爲我想限制框的高度並在需要時顯示滾動條;所以我添加了overflow-y: auto;，因爲這通常可以實現。但是現在我在示例的第二個框中看到了水平滾動條，儘管我不知道爲什麼？

我試着加入overflow-x: visible;但它沒有工作。我不想在這些框上設置任何寬度，因爲它們只需要是內容的寬度+一些填充。

您還會看到垂直滾動條過早啓動，並且不允許填充所需。

我能在這裏做什麼？

2013-12-23 Brett

的jsfiddle Demo

兩個原因和修復

在第二個div佔用太多的寬度造成橫向溢出的內容，因此增加了寬度

而不是overflow-x:visible嘗試overflow-x:hidden隱藏水平滾動條，即使寬度較高

2013-12-23 12:28:26

這有效地擺脫了滾動條，但仍然錯過了在右側的填充 - 我注意到你增加了一個寬度，我不是真的想要做的，因爲框的大小會有所不同。 – Brett

不是問題，只要刪除寬度並增加li的填充權即可。這裏是更新的[小提琴]（http://jsfiddle.net/surjithctly/BCTF9/2/） –

，但是當盒子沒有滾動條時，這不會導致比平常更大的填充？ – Brett

滾動條正在出現，因爲第二個div中有很多項目。嘗試刪除這些項目，他們會消失。

2013-12-23 12:24:37 Kishori

.cat_list { 
    overflow-y: auto; 
    overflow-x: hidden; 
    min-width: 200px; 
    padding: 10px; 
}

更換它

2013-12-23 12:25:25 Anup

該工程可以擺脫滾動條，但仍然錯過了墊在右邊。 – Brett

檢查編輯的答案 – Anup

與此

CSS

.cat_list{ height:200px; 
     background:#e4e4e4; 
     width:200px; 
     overflow:hidden; 
     overflow-y:scroll; 
     overflow-x:hidden;}

HTML

<div class="cat_list"></div>

嘗試3210

2013-12-23 12:27:53

回答