Column width not working in DataTables bootstrap

Question

I am using the following code to set the column width of a DataTable. During partial page load the width appears to be correct and when it loads completely, the width is off.

<script>
    $(document).ready(function () {
        $("#memberGrid").dataTable({
            "dom": 'T<"clear">lfrtip',
            "tableTools": {
                "sSwfPath": "../../Content/swf/copy_csv_xls.swf"
            },
            "destroy": true,
            "info": true,
            "bLengthChange": false,
            "bFilter": false,
            "bAutoWidth": false,
            "aoColumns": [{ "sWidth": "20%" }, { "sWidth": "20%" }, { "sWidth": "20%" }, { "sWidth": "10%" }, { "sWidth": "20%" }, { "sWidth": "10%" }]
        });
    });
</script>

Table Markup

<table class="group-grid table table-hover table-bordered table-responsive zebra-striped" id="memberGrid">
                <thead class="tablehead">
                    <tr>
                        <th style="width: 20%">Name</th>
                        <th style="width: 20%">Room with</th>
                        <th style="width: 20%">Extensions</th>
                        <th style="width: 10%">Travel Protection</th>
                        <th style="width: 20%">Flying from</th>
                        <th style="width: 10%">Balance</th>
                    </tr>
                </thead>
                <tbody>
            <tr class="tablerows">
                <td style="width: 20%"><%# Eval("Travelers") %></td>
                <td style="width: 20%"><%# Eval("RoomMates")%></td>
                <td style="width: 20%"><%# Eval("Extensions")%></td>
                <td style="width: 10%"><%# (string) Eval("HasTpp") == "Y"? "Yes" : "No"%></td>
                <td style="width: 20%"><%# Eval("Airport")%></td>
                <td style="width: 10%">$<%# Eval("Balance")%></td>
            </tr>
            </tbody>
                    </table>

Answer 1

Use the following script when defining datatable properties:

"columns": [
        { "width": "25px" },
        { "width": "25px" },
        { "width": "450px" },
        { "width": "20px" },
        { "width": "20px" },
        { "width": "20px" },
        { "width": "20px" },
        { "width": "20px" }
],