How to set the size of a column in a Bootstrap responsive table with HTML?

To set the size of a column in a Bootstrap responsive table with HTML, we use the col- classes.

For instance, we write

<div class="container-fluid">
  <table id="productSizes" class="table">
    <thead>
      <tr class="d-flex">
        <th class="col-1">Size</th>
        <th class="col-3">Bust</th>
        <th class="col-3">Waist</th>
        <th class="col-5">Hips</th>
      </tr>
    </thead>
    <tbody>
      <tr class="d-flex">
        <td class="col-1">6</td>
        <td class="col-3">79 - 81</td>
        <td class="col-3">61 - 63</td>
        <td class="col-5">89 - 91</td>
      </tr>
      <tr class="d-flex">
        <td class="col-1">8</td>
        <td class="col-3">84 - 86</td>
        <td class="col-3">66 - 68</td>
        <td class="col-5">94 - 96</td>
      </tr>
    </tbody>
  </table>
</div>

to add a table with the td elements set to the col- classes with the size of the table at the end to set their sizes.