2017-01-27 4 views
0

私は、ブートストラップクラスは.table応答使っていますし、テーブルがソートのこのような水平スクロールバーが含まれていますヘッダーと3つの左の列が固定されたテーブル?

<div class="table-responsive"> 
    <table class="table"> 
     <thead> 
      <tr> 
       <th>Column 1</th> 
       <th>Column ...</th> 
       <th>Column n</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td>Column 1</td> 
       <td>Column ...</td> 
       <td>Column n</td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

しかし、私は、ヘッダーを作成する必要があり、最初の3列は凍結します。 私はいくつかのバイブル、CSSのトリックやものを試してみましたが、それは残念です。テーブルレスでは、これらの例はブラウザの幅に100%適合するテーブルでしか動作しないようです。

答えて

-1

テーブルの代わりに<div>を使用すると、見出しを簡単に修正でき、display:table-cellも使用できます。

0

多分このhttp://getbootstrap.com/css/#grid-example-basicで問題を解決できます。

<thead> 
    <tr> 
     <th class="col-md-1">Column 1</th> 
     <th class="col-md-1">Column 2</th> 
     <th class="col-md-1">Column 3</th> 
     <th>Column ...</th> 
     <th>Column n</th> 
    </tr> 
</thead> 
関連する問題