ブートストラップ：オーバーフローするdivを隠す一連のdivを作成する方法

Question

サイトがブートストラップで構築されていて、jquery.dragscrollプラグインを使用してスワイプ可能なヘッダーを持つテーブルを作成したいが、ブートストラップ

だから私は、テーブルのヘッダを作成したい、と私は、このHTMLを使用しています：

<div class="row-fluid"> 
    <div class="span12"> 
     <div style="overflow:hidden;width:90%;"> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
      <div style="display:inline-block;width:100px">some content</div> 
     </div> 
    </div> 
</div> 

コードはここにある：http://jsfiddle.net/cVfzJ/1/

我々はフィドルのすべてのdivを見ることができるようにしています（溢れdivを隠して）二列に見える、私の目的は、単一の行にすべてのdivを持つことである

私は質問があなたがすべき明確な

Answer 1

であると思いますすべて<div>の合計に等しいwidthを持つすべての<div>のコンテナを持っています。その後、このコンテナの親はoverflow: autoを持つ必要があります。

レンダリング前の総幅がわからない場合は、JSを使用してレンダリングすることができます。あなたの例を続ける

：

<div class="row-fluid"> 
    <div class="span12"> 

     <!-- Changed from `hidden` to `auto`. --> 
     <div style="overflow:auto;width:90%;"> 

      <!-- This is the div that does the trick: --> 
      <div style="width:1200px;"> 

      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 
      <div style="display:inline-block;width:100px;">some content</div> 

      </div> 

     </div> 
    </div> 
</div>