DataTables + Bootstrap 3启用水平滚动问题

时间:2014-04-06 23:54:50

标签: jquery css twitter-bootstrap datatables

我在DataTables中集成了Bootstrap 3并且启用了水平滚动时出现问题

这是我的fiddle

DataTables初始化

/* Data Table Initialization */
    var equipmentDataTable = $('#equipmentTable').dataTable({
                                    "aoColumnDefs": [{ "sClass": "text-center", "aTargets": [ 0,25 ] },
                                                     { 'bSortable': false, 'aTargets': [ 25 ] }],
                                    "sScrollX": '100%'
                             });

我不知道为什么标题没有与表格的主体对齐。提前致谢

1 个答案:

答案 0 :(得分:-1)

我有一个类似的问题,但以不同的方式解决了它。

我修改了sDom参数以将表包装在一个额外的div中:

<i>
sDom: 'r<"H"lf><"datatable-scroll"t><"F"ip>',
I then applied the following styles to the .datatable-scroll class:

/**
 * Makes the table have horizontal scroll bar if its too wide for its container
 */
.datatable-scroll {
    overflow-x: auto;
    overflow-y: visible;
}
</i>