Seeking assistance in removing spaces in the pagination buttons of datatables. Can you please help me achieve this?
https://i.sstatic.net/JwQQw.png
I have tried following the instructions from the URLs below:
DATA TABLES BOOTSTRAP 4 EXAMPLE
Despite adding the .js and CSS files as directed in the above links, the issue persists.
Datatables pagination buttons - Remove unwanted space
Unfortunately, none of the solutions provided seem to be working. In need of help to override the current functionality. Thank you.
Below is the code I've been working on:
HTML
<!-- BOOTSTRAP -->
<link rel="stylesheet" href="stylesheets/bootstrap.min.css">
<script src="javascript/third_party/popper.min.js"></script>
<script src="javascript/third_party/bootstrap.min.js"></script>
<!-- DATA TABLES -->
<link rel="stylesheet" href="https://cdn.datatables.net/v/bs4/dt-1.10.18/datatables.min.css" />
<script src="https://cdn.datatables.net/v/bs4/dt-1.10.18/datatables.min.js"></script>
<script src="https://cdn.datatables.net/plug-ins/1.10.19/sorting/datetime-moment.js"></script>
CSS
.dataTables_wrapper .dataTables_paginate .paginate_button {
padding : 0px;
margin-left: 0px;
display: inline;
border: 0px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
border: 0px;
}
Jquery
$.fn.dataTable.moment('MM/DD/YYYY');
$(`#${ID}`).DataTable({
columnDefs: [{
targets: [0, 1, 2, 5, 6, 7],
orderable: false
}],
"order": [[4, "asc"]]
});