title: jquery DataTable fnAddData adding a white block in column header
body: <p>When the following fnAddData function executes an extra block of white is added in the header and the checkbox is not aligned under the Select column header.<br>
  <a href="https://i.stack.imgur.com/YmgP3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/YmgP3.png" alt="Column White Space and offset checkbox"></a></p>
  
  <pre><code>var select = '&lt;input type="checkbox" class="chkSelect" /&gt;';
  var waive = '';
  var ndex = tblOutstandingFees.fnAddData([select, waive, item.Year,
             item.Batch, item.FeeType, parseFloat(item.Amount).toFixed(2),
             (item.IsNSF.toString().toLowerCase() == 'true' ? 'Yes' : 'No')]);
  var nTr = tblOutstandingFees.fnSettings().aoData[ndex[0]].nTr;
  nTr.className = "row " + nTr.className;
  </code></pre>
  
  <p>Does anyone know what may cause this?  I have not changed the datatable css other than the blue background color for the header row. </p>
  
  <pre><code>.table thead &gt; tr &gt; th {
  background: #428bca url("../images/light-blue-btn.jpg") repeat scroll 0 0;
  border-color: #428bca;
  color: #fff;
  vertical-align: bottom;}
  </code></pre>
  
  <p>Oddly, if I have firebug open and go to inspect the element the white space goes away after clicking in the firebug html window.</p>
  
  <p>This is only happening in Firefox v 45.0.2, works correctly in IE and Chrome</p>