修正頭の時のブートストラップスクロールテーブルブレーク

Question

私の英語のために申し訳ありません！スクロールするときにテーブルヘッダーを修正したいそして、残りのページコンテンツをスクロールします。しかし、テーブルの元のレイアウトが壊れます。テーブルの列と行の幅は異なるサイズです。私はそれを修正することはできません。よろしく。

マイコード：

HTML

<section class="scrollable padder"> 
<table class="table table-striped m-b-none text-sm m-t"> 
<thead class="ff"> 
<tr> 
    <th >1col</th> 
    <th >2col</th> 
</tr> 
</thead> 
<tbody> 
    <tr> 
     <td class="new_td">field1</td> 
     <td class="new_td">field2</td> 
    </td> 
</tbody> 
</table> 
</section> 

JS

$(".padder").scroll(function() { 
    if ($(".padder").scrollTop() > 100) { 
      $('.ff').addClass('fixed'); 
      } 
      else 
    { 
    $('.ff').removeClass('fixed'); 
    } 
    }); 

CSS

.fixed{  
    position:fixed; 
    top:50px; 
} 

Answer 1

このタグを試してみて、私は結果をお知らせ

<section class="scrollable padder"> 
    <table class="table table-striped m-b-none text-sm m-t"> 
    <thead class="ff"> 
    <tr> 
     <th >1col</th> 
     <th >2col</th> 
    </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td class="new_td">field1</td> 
      <td class="new_td">field2</td> 
     </tr> 
    </tbody> 
    </table> 
    </section>