父div有溢出滚动时如何增加宽度？

Question

当父div有溢出滚动时，如何增加上面小提琴的宽度， 我尝试使用jQuery增加每列的宽度，但th的宽度保持不变。 但是，如果我尝试增加div内部div标签的宽度，那么列的大小会增加，但我需要宽度为th而不是div

如果我将宽度设置为500px则没有任何变化：

<th width="500px">&nbsp;</th>

JsFiddle

<div style="overflow-x:auto;">
  <table border="1" id="Sample">
    <thead>
      <tr>
        <th width="200px" class="thead selector noedit">&nbsp;</th>
        <th width="200px" data-field="" data-length="10" class="thead">
          <div style="width:100px">Category ID</div>
        </th>
        <th data-field="" data-length="30" class="thead ">
          <div>ID2</div>
        </th>
        <th data-field="" data-length="13" class="thead ">
          <div style="width:130px">ID3</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID4</div>
        </th>
        <th data-field="" data-length="21" class="thead">
          <div style="width:210px">ID5</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID6</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID7</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID8</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID9</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID11</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID12</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID13</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID14</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID15</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID16</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID17</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID18</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID19</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID21</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID22</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID23</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID24</div>
        </th>
        <th data-field="" data-length="10" class="thead ">
          <div style="width:100px">ID25</div>
        </th>
      </tr>
    </thead>
  </table>
</div>