title: Specifying a fixed column width in jQuery Datatables
body: <p>I'm trying to specify a fixed width for a few columns in a jQuery datatable. I've attempted to accomplish this via the column definitions specified in the <a href="http://datatables.net/reference/option/columns.width">datatables documentation</a>, but the column and column header still get auto-sized. </p>
  
  <p>Here's the jsFiddle I've been working with: <a href="http://jsfiddle.net/hunterhod/4foLcq0w/">jsFiddle</a></p>
  
  <p><strong>JavaScript:</strong></p>
  
  <pre><code>var table = $('#example2').DataTable({
          "tabIndex": 8,
          "dom": '&lt;"fcstTableWrapper"t&gt;lp',
          "bFilter": false,
          "bAutoWidth": false,
          "data": [],
          "columnDefs": [
              {
                  "class": 'details-control',
                  "orderable": false,
                  "data": null,
                  "defaultContent": '',
                  "targets": 0
              },
              { 
                  "targets": 1},
              { 
                  "targets": 2,
                  "width": "60px"},
              { 
                  "targets": 3,
                  "width": "1100px"},
              { 
                  "targets": 4},
              { 
                  "targets": "dlySlsFcstDay"},
              { 
                  "targets": "dlySlsFcstWkTtl",
                  "width": "60px"}
          ],
          "order": [
              [1, 'asc']
          ]
      });
  </code></pre>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div class="forecastTableDiv"&gt;
              &lt;table id="example2" class="display" cellspacing="0" width="100%"&gt;
                  &lt;thead&gt;
                  &lt;tr&gt;
                      &lt;th colspan="5"&gt;&lt;/th&gt;
                      &lt;th  class="slsFiscalWk" colspan="8"&gt;201424&lt;/th&gt;
                      &lt;th  class="slsFiscalWk" colspan="8"&gt;201425&lt;/th&gt;
                      &lt;th  class="slsFiscalWk" colspan="8"&gt;201426&lt;/th&gt;
                      &lt;th  class="slsFiscalWk" colspan="8"&gt;201427&lt;/th&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;!--&lt;th&gt;&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Vendor&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Origin ID&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Destination&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Vendor Part Nbr&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;SKU&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Mon&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Tue&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Wed&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Thu&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Fri&lt;/th&gt;--&gt;
                      &lt;!--&lt;th&gt;Week Ttl&lt;/th&gt;--&gt;
  
                      &lt;th&gt;&lt;/th&gt;
                      &lt;th&gt;Vendor&lt;/th&gt;
                      &lt;th&gt;Origin ID&lt;/th&gt;
                      &lt;th style="width: 200px"&gt;Vendor Part Nbr&lt;/th&gt;
                      &lt;th&gt;SKU&lt;/th&gt;
                      &lt;!-- First week --&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Mon&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Tue&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Wed&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Thu&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Fri&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Sat&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Sun&lt;/th&gt;
                      &lt;th class="dlySlsFcstWkTtl" &gt;Week Ttl&lt;/th&gt;
                      &lt;!-- Second week --&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Mon&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Tue&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Wed&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Thu&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Fri&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Sat&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Sun&lt;/th&gt;
                      &lt;th class="dlySlsFcstWkTtl" &gt;Week Ttl&lt;/th&gt;
                      &lt;!-- Third week --&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Mon&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Tue&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Wed&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Thu&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Fri&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Sat&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Sun&lt;/th&gt;
                      &lt;th class="dlySlsFcstWkTtl" &gt;Week Ttl&lt;/th&gt;
                      &lt;!-- Fourth and final week --&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Mon&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Tue&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Wed&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Thu&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Fri&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Sat&lt;/th&gt;
                      &lt;th class="dlySlsFcstDay" &gt;Sun&lt;/th&gt;
                      &lt;th class="dlySlsFcstWkTtl" &gt;Week Ttl&lt;/th&gt;
                  &lt;/tr&gt;
                  &lt;/thead&gt;
  
                  &lt;tfoot&gt;
              &lt;/table&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>When I inspect the live code, I can see that the width I'm specifying in the column definition is getting added to the column as a style attribute, but it doesn't match the actual width of the column.</p>