DataTables - FixedHeader - multiple tr in thead alignment issue

Question

Please see this page: http://live.datatables.net/fadoteba/1/

The problem I am having is that when I have a thead like this:

<thead>
    <tr style="background-color: #99b3ff">
        <th align="left" colspan="13">
            somelongnamehere-dsadsadsadsadsadsa<br />
            Total LPARs: 9<br />
            Planned LPARs: 0<br>
            <br>
            Free memory: 286 GB (excl planned lpars)<br />
            Total vCPU (incl planned): 21
        </th>
    </tr>
    <tr>
        <th width="100">Customer</th>
        <th>Frame</th>
        <th>LPAR</th>
        <th>CPU<br>Virtual</th>
        <th>Cluster</th>
        <th>Bubble</th>
        <th>ProcPool</th>
        <th>Mem (GB)</th>
        <th>Add<br>Mem (GB)</th>
        <th>Total<br>Mem (GB)</th>
        <th>Mem<br>overhead (GB)</th>
        <th>AME</th>
        <th>ReqID</th>
    </tr>
</thead>

It screws up the alignment of the fixedheader, when I remove the first <tr> with the th and the colspan it works like it should (also scroll down in the example to see this). what can I do to get this fixed, or what am I doing wrong?

Answer 1

A bit late but i spent 6 hours on this issue till i accidentaly stumbled on the solution which was to remove the table-layout from the CSS and then I found this solution here!

.dataTable.fixedHeader-floating {
    table-layout: auto !important;
}

Answer 2

Your problem is style of table. It sets table-layout property automatically on your table. I add below line to css to fix problem :

table {
   table-layout: auto !important;
}

Datatable Link