dataTables fixedColumns part is not working
<p>Between <code>&lt;head&gt;</code> tags:    </p>

<pre><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css"/&gt;
&lt;link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/fixedcolumns/3.2.1/css/fixedColumns.dataTables.min.css"/&gt;
&lt;script type="text/javascript" src="https://cdn.datatables.net/fixedcolumns/3.2.1/js/dataTables.fixedColumns.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="https://cdn.datatables.net/1.10.11/js/jquery.dataTables.min.js"&gt;&lt;/script&gt;
</code></pre>

<p>Script:</p>

<pre><code>&lt;script&gt;
$(document).ready(function() {
    var table = $('#example').DataTable( {
        scrollY:        "300px",
        scrollX:        true,
        scrollCollapse: true,
        paging:         true,
        fixedColumns:   {
            leftColumns: 2
        }
    } );
} );
&lt;/script&gt;
</code></pre>

<p>Table (it has more than 2 rows):</p>

<pre><code>&lt;table id="example" class="stripe row-border order-column" cellspacing="0" width="100%"&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;..&lt;/th&gt;
&lt;th&gt;..&lt;/th&gt;
&lt;th&gt;..&lt;/th&gt;
&lt;th&gt;..&lt;/th&gt;
&lt;th&gt;..&lt;/th&gt;
&lt;th&gt;..&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;...&lt;/td&gt;
&lt;td&gt;...&lt;/td&gt;
&lt;td&gt;...&lt;/td&gt;
&lt;td&gt;...&lt;/td&gt;
&lt;td&gt;...&lt;/td&gt;
&lt;td&gt;...&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
</code></pre>

<p>CSS:</p>

<pre><code>/* Ensure that the demo table scrolls */
th, td { white-space: nowrap; }
div.dataTables_wrapper {
    width: 100%;
    margin: 0 auto;
}
</code></pre>

<p>Table is working but table has no fixed columns. FixedColumns part is not working.</p>