HTML表格的tbody不是100％

Question

我有一個表，但它不是100％，TBODY尺寸是：485x170px，

有人可以幫助我，使這個TBODY 100％？

<thead> needs to be fixed as now. 

我需要有雙擊自動滾屏和TBODY需要留在大小：height: calc(100vh - 513px); click to see the image

的jsfiddle：https://jsfiddle.net/ab1Lsn0h/2/

CSS：

.staff table tbody { 
    overflow-y: scroll; 
    display: block; 
    height: calc(100vh - 513px); 
} 

.staff tbody > tr { 
    display: table; 
    width: 100%; 
} 

HTML：

<div class="col-md-4"> 
    <div class="panel panel-default staff"> 
    <div class="panel-heading">test</div> 
    <div class="panel-body"> 
     <table class="table table-striped"> 
     <thead> 
      <tr> 
      <th>Name</th> 
      <th>Surname</th> 
      <th></th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
      <td>name 1</td> 
      <td>name 2</td> 
      </tr> 
      <tr> 
      <td>name 1</td> 
      <td>name 2</td> 
      </tr> 
      <tr> 
      <td>name 1</td> 
      <td>name 2</td> 
      </tr> 
      <tr> 
      <td>name 1</td> 
      <td>name 2</td> 
      </tr> 
      <tr> 
      <td>name 1</td> 
      <td>name 2</td> 
      </tr> 

     </tbody> 
     </table> 
     <div class="clearfix"></div> 
    </div> 
    </div> 
</div> 

Answer 1

您必須清除您的display: block;和display: table;。

你正在轉換tr表，這是錯誤的。