title: Handsontable creates double headers
body: <p>My handsontable instance has something what looks like double headers: 
   <a href="https://i.stack.imgur.com/ou3vT.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ou3vT.jpg" alt="enter image description here"></a></p>
  
  <p>Within the browser the yellow marked one is the <strong>ColHeader</strong> and is also 
  the one that goes down with the scrolling. </p>
  
  <p>I have an Array with Objects. With this structure:</p>
  
  <pre><code>    Array[Object,Object,Object...]
  </code></pre>
  
  <p>Each Object has multiple parameters and has 'normal' object structure like:</p>
  
  <pre><code>    id: 'value'
      id: 'value'
  </code></pre>
  
  <p>The handsontable instance:</p>
  
  <pre><code>    var $container = $("#viewTest");
      $container.handsontable({
            data: sub,
            colHeaders: true
      });
  </code></pre>
  
  <p><strong>viewTest</strong> is the div container.
  <strong>sub</strong> is the name of the array. </p>
  
  <p>Everything looked ok until i tried to add <strong>colHeaders</strong>. I do not whant
  to display all the parameters so i only created columns for some, worked also fine. I have now removed everything else and still getting the same issue. I have removed also the <strong>css</strong> styling like suggested <a href="https://stackoverflow.com/questions/31282792/double-rendering-of-col-and-row-headers-using-handsontable" title="herequot;">here</a>. </p>
  
  <p>Maybe one more information: I take the <strong>array</strong> out of a ajax responce. 
  I save it in a variable like : </p>
  
  <pre><code>    var sub = responce.data[i];
  </code></pre>
  
  <p>I am not aware that that changes anything. </p>
  
  <p>I would appricate a idea where this comes from. 
  Thank you for your time. </p>