嵌套的div寬度停止在父滾動div的滾動條上

Question

基本上，我有一個帶有嵌套內容的主容器div。這個div有一個動態寬度，並將調整頁面大小。

現在，在這個div中，我有一個項目列表。所有的項目都是固定的寬度，我希望能夠擴展容器div（overflow：auto）。如果我將我的列表設置爲display：block，它將成爲容器的100％寬度。但是，如果有許多強制水平滾動條的列表項，則阻止列表停止在容器滾動條處，並且列表項繼續傳遞給它。

下面是一個例子：http://jsfiddle.net/9tjZz/4/

我怎樣才能阻止列表，延長通過容器列表中的項目做的滾動條？

Answer 1

您可以使用clearfix來修復此問題...只需將clearfix類添加到您的容器並添加相應的CSS即可。這裏是工作示例：

http://jsfiddle.net/9tjZz/5/

這是你需要的CSS：

.clearfix:after { 
     content: "."; 
     display: block; 
     clear: both; 
     visibility: hidden; 
     line-height: 0; 
     height: 0; 
    } 

    .clearfix { 
     display: inline-block; 
    } 

    html[xmlns] .clearfix { 
     display: block; 
    } 

    * html .clearfix { 
     height: 1%; 
    } 

然後添加class="clearfix"需要的地方。就你而言，它是容器。