Ширина столбца DataTable с выбором в го

Question

Использование Bootstrap 4 с таблицами данных. У меня есть скрытая карта, содержащая данные. При загрузке страницы, если проверено сохраненное предпочтение (показать карточку, содержащую таблицу), я показываю карточку, а затем настраиваю столбцы и рисую:

кусок $ (документ) .ready:

/* code to create table here */

/* wait for the table initialization to finish before restoring card visibility */
$('#dashboardProfitsTable').on('init.dt', function(e, settings, json) {
  $.when(
    restorePrefs(currentPrefPage))
    .done(function() {
      /* did user leave this card visible last time? */
      if ($('input[name=ShowProfit]').is(":checked")) {
        $('#profitsCard').show();
        dashboardProfitsTable.columns.adjust().draw();
      }
    });
});

и некоторые соответствующие HTML:

<div id="profitsCard" class="card" style="display:none">
  <div class="card-body pt-0 pb-2">
    <table id="dashboardProfitsTable" class="table" style="width:100%">
      <thead>
      <tr>
        <th></th>
        <th><select id="column1" class="form-control"></select></th>
        <th><select id="column2" class="form-control"></select></th>
        <th><select id="column3" class="form-control"></select></th>
        <th><select id="column4" class="form-control"></select></th>
      </tr>
      </thead>

После show () правая сторона выделения в правом столбце (последние 30 дней) обрезается на пару пикселей :

но если я изменю размеры окна шириной даже на 1 пиксель (шире или уже; не имеет значения), таблица пересчитывает ширину и перерисовывает aws, поэтому правая часть Четвёртое не обрезается:

И после этого начального изменения размера окна все в порядке на любой ширине. Это просто начальная функция show (), которая обрезает самый правый выбор. Есть ли что-то, что я могу сделать, кроме columns.adjust (). Draw () после show (), чтобы получить данные для повторного вызова c, как если бы он делал восстановление размера окна c?