title: JQuery Datatable - Header Alignment Issue
body: <p>I am working in JQUERY Datatable. I had filled the data in the table. Also, i had introduced Horizontal scroll, Vertical Scroll and Fixed Columns. </p>
  
  <p>My div and table is as follows..</p>
  
  <pre><code>&lt;div id="div1" style="padding-left: 5px;"&gt;
  &lt;/div&gt;
  
  &lt;table class='tftable' cellspacing='0' rules='all' border='1' id='ItemDetails' cellpadding='0' style='font-family: Arial; border-collapse:collapse;width:150%;'&gt;
  &lt;thead&gt;
  &lt;tr class='tftable'&gt;
  ............... 
  &lt;/tr&gt;
  &lt;/thead&gt;
  &lt;tbody&gt;
  ..........
  &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>I am binding the table to div.</p>
  
  <pre><code>$("#div1").html(html)
  </code></pre>
  
  <p>CSS and JS Used :</p>
  
  <pre><code>&lt;link rel="stylesheet" type="text/css" href="../Scripts/jquery-plugins/dataTables/dataTables/1.9.4/css/jquery.dataTables.css" /&gt;
  &lt;script type="text/javascript" src="../Scripts/jquery-plugins/dataTables/dataTables/1.9.4/js/jquery.dataTables.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="../Scripts/jquery-plugins/dataTables/fixedHeader/2.0.6/FixedHeader.min.js"&gt;&lt;/script&gt;
  &lt;script src="../Scripts/jquery-plugins/dataTables/fixedColumns/2.0.3/FixedColumns.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>My document.ready is</p>
  
  <pre><code>$(document).ready(function () {
  
              var oTable = $('#ItemDetails').dataTable({
                  "bAutoWidth": false,
                  "bPaginate": true,
                  "bSort": true,
                  "sScrollX": "100%",
                  "bScrollCollapse": true,
                  "sScrollY": "395px",
                  "aoColumns": [{ "sWidth": "15%" }, { "sWidth": "2%" }, { "sWidth": "2%" }, { "sWidth": "8%" }, { "sWidth": "5%" }, { "sWidth": "6%" }, { "sWidth": "7%" }, { "sWidth": "10%" }, { "sWidth": "3%" }, { "sWidth": "2%" }, { "sWidth": "4%" }, { "sWidth": "5%" }, { "sWidth": "5%" }, { "sWidth": "10%" }, { "sWidth": "10%" }],
                  "aoColumnDefs": [
                          {
                              "bSortable": false, "aTargets": [1,2,3,4,5,6,7,8,9,10,11,12,13,14]
                          }
                  ]
              });
              new FixedColumns(oTable, {
                  "iLeftColumns": 3,
              });
  });
  </code></pre>
  
  <p>This is my problem,</p>
  
  <p>In the result table, the header and the body columns are not aligned properly. I had searched lot of links. But i dint get any solution.</p>