2012-01-19 9 views
0

基本的には、ネストされた内容のメインコンテナdivがあります。このdivは動的な幅を持ち、ページのサイズが変更されます。親スクロール可能なdivのスクロールバーでネストされたdivの幅が停止する

今、この部門では、私はアイテムのリストを持っています。すべての項目は固定幅で、コンテナdiv(オーバーフロー:自動)を拡張できるようにしたい。リストをdisplay:blockとして設定すると、コンテナの幅が100%になります。ただし、水平スクロールバーを強制するリストアイテムが多数ある場合、ブロックリストはコンテナスクロールバーで停止し、リストアイテムは引き続きそのアイテムを渡します。ここで

は一例です:http://jsfiddle.net/9tjZz/4/

はどのようにしてブロックリストは、アイテムが行うコンテナリストのスクロールバーを通過した拡張するために得ることができますか?

答えて

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"を追加します。あなたの場合、それはコンテナです。

+0

パーフェクト。ありがとうございました! – matt

関連する問題