数据表不是全角

Question

我有3个导航，每个导航都包含与datatables不同的表，但是在第二个和第三个导航中，我的表不是全角的。我也尝试了一些解决方法here，但是没有运气。

屏幕截图

first tab

seond tab

代码

<link href="{{ asset('css/dataTables.bootstrap4.min.css') }}" rel="stylesheet">
<script src="{{ asset('js/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('js/dataTables.bootstrap4.min.js') }}"></script>
<script defer>
    $(document).ready(function() {
        $('.example').DataTable({
            responsive: true,
            "aaSorting": [[ 0, "desc" ]],
            dom: "<'row'<'col-sm-6'l><'col-sm-6 float-right'f><'col-sm-12 mb-3 d-flex justify-content-center'p>>" +
            "<'row'<'col-md-12'tr>>" +
            "<'row'<'col-sm-5 mt-3'i><'col-sm-7'p>>",
        });
    });
</script>

{{-- trying to solve the width issue (testing) --}}
<script>
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
    $($.fn.dataTable.tables(true)).DataTable()
        .columns.adjust();
});
</script>

有什么主意吗？

Answer 1

这个对我有用。

<style>
    div#DataTables_Table_0_wrapper {
        width: 100% !important;
    }
</style>