Thead и tat of Datatable не выстраиваются в одну строку - PullRequest
Новая
       5

Thead и tat of Datatable не выстраиваются в одну строку

0 голосов
/ 20 октября 2018

Я должен исправить последний столбец в правой части таблицы, остальные все столбцы будут прокручиваться.Но у меня есть проблема выравнивания.thead и tbody таблицы не выравниваются.Ниже я использую Js и CSS для разработки таблицы.Я хочу, чтобы все записи в одной строке означали white-space: nowrap.Пожалуйста, проверьте скриншот сначала

Datatable Js 

$('#example1').DataTable({
        scrollY:        "600px",
        scrollX:        true,
        scrollCollapse: true,
        "bAutoWidth": true,
        paging:         true,
        "bLengthChange": false,
        /* "bFilter": true,
        "bInfo": false, */
        "pageLength": 20,
        fixedColumns:   {
            rightColumns: 1,
            leftColumns: 0
        },
        language: {
            paginate: {
              next: '<i class="fa fa-angle-double-right">',
              previous: '<i class="fa fa-angle-double-left">'  
            }
        },
        "dom": '<"top"fip>rt<"clear">'
    });

Datatable css: 

    .custom-table-design .table
{
        border-collapse: collapse;
        border-spacing:1px;
        width:100%;
        max-width: 100%;
       max-width: 100%;   
    }

    .custom-table-design .table thead th,
    .custom-table-design .table tbody td{
        white-space: nowrap;
    }
    .custom-table-design .dataTables_scrollHead .table thead tr th,
    .custom-table-design .DTFC_RightWrapper .DTFC_RightHeadWrapper .table thead tr th {
        background: #e5e9f2 !important;
        border-bottom: 0px solid #f4f4f4;
        padding: 0.5rem 1rem !important;
        padding-right: 2rem !important
    }

    .custom-table-design .table>tbody>tr>td, 
    .custom-table-design .table>tbody>tr>th, 
    .custom-table-design .table>tfoot>tr>td, 
    .custom-table-design .table>tfoot>tr>th, 
    .custom-table-design .table>thead>tr>td, 
    .custom-table-design .table>thead>tr>th{
        padding: 0.5rem 1rem !important;
        padding-right: 2rem !important
    }

Здесь мой thead и tbody не выравниваются на одной строке,последний столбец фиксирован

...