使用固定标题将td强制设为与表中th相同的宽度

Question

我有一张桌子 表内容可以动态更改。用户可以添加或删除行和列。

并自动调整大小以适合数据。

这就是我想要的样子。

但是现在我在y-scroll上添加了一个固定的标头，现在's不适合's。而且我不能将列设置为固定大小，因为内容可以更改

我的HTML：

<div class="table-responsive tableFixedHead">
   <table class="w-100">
     <thead>
       <tr>
          <th style="width:5%">#</th>
          <th style="width:60%">Fråga</th>
          <th style="width:5%">Type</th>
       </tr>
     </thead>
     <tbody>
           <tr>
               <td>32</td>
               <td>text</td>
               <td>text</td>
          </tr>
     </tbody>  
 </table>
</div>

我的CSS：

.tableFixedHead table {
width: 100%;
table-layout: fixed;
}

/*
.tableFixedHead {
    width: auto;
}
*/
.tableFixedHead thead {
   background: white;
   display: table;
   width: 100%;
}

.tableFixedHead tbody {
  height: 100px;
   overflow: auto;
  overflow-x: hidden;
  display: block;
  width: 100%;
}

.tableFixedHead tbody tr {
display: table;
width: 100%;
table-layout: fixed;
}

我尝试了不同的表格布局组合，但显示螺母无法正确放置。