Совместите столбцы с таблицами данных YADCF

Question

Я хочу, чтобы заголовки столбцов, фильтры и столбцы таблицы были выровнены. Я перепутал с bAutoWidth, sWidth и CSS, но, похоже, ничего не работает. Кто-нибудь, пожалуйста, будьте любезны показать мне, как правильно настроить выравнивание столбцов?

    $(function () {
        var table = $('#fill').DataTable({
            "bPaginate" : false,
            "bAutoWidth": false,
            "scrollY": "600px",
            "scrollX": "100%",
            "aoColumns": [
                { "sWidth": "28px" },
                {"sWidth": "60px" },
                {"sWidth": "6px" },
                {"sWidth": "6px" },
                {"sWidth": "8px" },
                {"sWidth": "30px" },
                {"sWidth": "2px" },
                {"sWidth": "13px" },
                {"sWidth": "10px" },
                {"sWidth": "17px" }, 
                {"sWidth": "19px" },
                {"sWidth": "4px" }, 
                {"sWidth": "14px" }, 
                {"sWidth": "10px" },
                {"sWidth": "13px" }, 
                {"sWidth": "15px" },
                {"sWidth": "10px" }, 
                {"sWidth": "10px" }, 
                {"sWidth": "10px" }, 
                {"sWidth": "18px" },
                {"sWidth": "10px" }, 
                {"sWidth": "30px" },
                {"sWidth": "8px"}, 
                {"sWidth": "4px"}, 
                {"sWidth": "4px"} 
            ]
        });


        //column filters
        yadcf.init(table, [
            { column_number: 0, filter_type: "text", filter_container_id:"accountFilter" }, 
            {column_number: 1, filter_type: "text", filter_container_id: "nameFilter" },
            {column_number: 2, filter_type:"text", filter_match_mode:"exact" ,filter_container_id: "lotFilter" },
            {column_number: 3, filter_type: "text", filter_container_id: "CTFilter" },
            {column_number: 4, filter_type: "text", filter_container_id: "ageFilter" },
            {column_number: 5, filter_type: "text", filter_container_id: "collectorFilter" },
            {column_number: 6, filter_type: "text", filter_container_id: "levelFilter" },
            {column_number: 7, filter_type: "text", filter_container_id: "vinFilter" },
            {column_number: 8, filter_type: "text", filter_container_id: "taggedFilter" }, 
            {column_number: 9, filter_type: "text", filter_container_id: "truckFilter" },
            {column_number: 16, filter_type: "text", filter_container_id: "recoveryFilter" },
            {column_number: 19, filter_type: "text", filter_container_id: "typeFilter" },
            {column_number: 10, filter_type: "text", filter_container_id: "SPFilter" },
            {column_number: 11, filter_type: "text", filter_container_id: "MPFilter" },
            {column_number: 12, filter_type: "text", filter_container_id: "RSFFilter" },
            {column_number: 13, filter_type: "text", filter_container_id: "latesFilter" }, 
            {column_number: 14, filter_type: "text", filter_container_id: "dueFilter" },
            {column_number: 15, filter_type: "text", filter_container_id: "netFilter" },
            {column_number: 20, filter_type: "text", filter_container_id: "PTDFilter" },
            {column_number: 21, filter_type: "text", filter_container_id: "nDownFilter" },
            {column_number: 17, filter_type: "text", filter_container_id: "sourceFilter" },
            {column_number: 18, filter_type: "text", filter_container_id: "reconFilter" }, 
            {column_number: 22, filter_type: "text", filter_container_id: "STLTFilter"},
            {column_number: 23, filter_type: "text", filter_container_id: "payTypeFilter"},type
            {column_number: 24, filter_type: "text", filter_container_id: "wholesaleOrRetailFilter"}
        ]);
    });

Answer 1

Попробуй это

   $(document).ready(function () {
        $('#yadcf').dataTable(
            {
                "columnDefs": [
                    {
                        "orderData": [1, 0], "targets": 0,
                    },
                    {title: "", className: "dt-head-center", "target": "_all"},
                    {className: "dt-body-center", "targets": "_all"},
                ]
            }
        ).yadcf([
            {column_number: 0},
            {column_number: 1},
            {column_number: 2},
            {column_number: 3},
        ]);
    });