title: Tabulator layout:"fitColumns" causes vibrating DIV
body: <p>I have a tabulator 4.9 contained within one element of a flexbox. The flexbox element has flex-grow&gt;0.</p>
  <p>Some of my columns are hidden during the initial draw. The select element above the table hides columns and shows the selected column, and redraws the table.</p>
  <p>When using layout:&quot;fitColumns&quot;, the table has two issues when first rendered-</p>
  <ol>
  <li>The table is wider than it's container, by roughly the width of the scrollbar. Changing the selectbox above the table causes the table to redraw and fixes this issue.</li>
  <li>The table vibrates erratically. Both the container DIV and the table are shifting back and forth by 1 or 2 pixels. They appear to be stuck in a feedback loop.</li>
  </ol>
  <p>I am using Chrome 87.0.4280.141 (Official Build) (64-bit)</p>
  <p>Example here:
  <a href="https://beta.tspcenter.com/tabulator.php" rel="nofollow noreferrer">https://beta.tspcenter.com/tabulator.php</a></p>
  <p>Tabulator code:</p>
  <pre><code>table = new Tabulator(&quot;#leaderboardTablesContainer&quot;, {
      height: &quot;311px&quot;,
      layout:&quot;fitColumns&quot;,
      index:&quot;Username&quot;,
      data: results,
      columns:headers,
      initialSort:[{column:firstVisibleColumn, dir:&quot;desc&quot;}]
  }); 
  </code></pre>
  <p>Select element code:</p>
  <pre><code>select.addEventListener('change',function(e) {
      table.clearFilter();
      table.hideColumn(table.currentColumnVisible);
      table.showColumn(e.target.value);
      table.setSort(e.target.value,&quot;desc&quot;);
      table.currentColumnVisible = e.target.value;
      table.setFilter(e.target.value, &quot;!=&quot;, &quot;&quot;);
      table.redraw();
  });
  </code></pre>