如何将分页集中在jQuery Bootstrap DataTables插件中？

Question

我正在使用带有Bootstrap 3.1的jQuery的DataTables插件来对服务器端内容进行排序和分页.

这就是我的表格

http://datatables.net/manual/styling/bootstrap-simple.html

分页和排序工作正常......但默认情况下,分页位于表格的右侧.我想把它展示在桌子的中心.我对CSS的了解很少,所以我不确定在哪里进行更改.如何实现这一目标？

Answer 1

将DataTable初始化为:

$(document).ready(function () {

    /* DataTables */
    var myTable = $("#myTable").dataTable({
        "sDom": '<"row view-filter"<"col-sm-12"<"pull-left"l><"pull-right"f><"clearfix">>>t<"row view-pager"<"col-sm-12"<"text-center"ip>>>'
    });

});

Answer 2

到目前为止,这里提到的解决方案都没有为我工作.

这是我使用的:

 div.dataTables_paginate {text-align: center}

在div与类dataTables_paginate,在我的布局,具有宽度等于其包含分区的100%.在text-align被定心ul控制- <ul class="pagination">包含在其中dataTables_paginate.

我的"DOM"属性很简单.它看起来像这样:

 "dom": 'rtp'

Answer 3

这是基于 Karl 的答案，但对于 DataTables v1.10.12，我必须在 CSS 覆盖文件中提供一些额外的详细信息，以便让它们坚持下去。

div.dataTables_info {position:absolute}
div.dataTables_wrapper div.dataTables_paginate {float:none; text-align:center}