Question

我有一个表格，其正文可滚动。但问题是，它的tr元素并没有占据表的全宽。这是我的标记

 <table style="border-radius: 10px; border: 1px solid grey; text-align: center;">
      <thead style="display: block;">
           <tr>
                <td style = "width:10%;"><input id="chkSelectAllSubs" type="checkbox"></td>
                <td style = "width:40%;">Subscriber ID</td>
                <td style="width:50%">Subscriber Name</td>
           </tr>
     </thead>
     <tbody style="display: block; max-height: 300px; overflow-y: scroll" width="100%">
           <tr>
                 <td style = "width:10%;"><input id="chk_13450" type="checkbox"></td>
                 <td style = "width:40%;">13450</td>
                 <td style = "width:50%;">GREEN JOE</td>
          </tr>
          <tr>
               <td style = "width:10%;"><input id="chk_44109" type="checkbox"></td>
               <td style = "width:40%;">44109</td>
               <td style = "width:50%;">John26 Smith26</td>
         </tr>
     </tbody>
 </table>

Answer 1

你可以看到你的问题的下面的小提琴链接，我已经在小提琴中尝试了它并使tr元素全宽到表格宽度。

http://jsfiddle.net/cesb8n4j/1/

你的tr不是全宽，因为默认情况下它需要display: table-row;所以我们要求display: table;

可滚动的表体

1 个答案: