Bootstrap 4 pagination style isn't working correctly

italoborges

Hello, I'm using Boostrap 4 with my DataTables and the pagination is not working correctly.
I can fix it on my own css, but it's not the best solution. Anyone having the same problem?

An example:
https://imgur.com/a/nHI6J

alfasino9

Hello,

I have encountered the same, and i have fixed it with if i remember fine, the bootstrap.min.js was not called.

Have a look of the JavaScript and the stylesheets of bootstrap are all called in your file

Regards

italoborges

Thanks! Mine still doesn't work.
I checked my WebPack config and I'm calling everything:

DataTables JS
DataTablesDt CSS

Bootstrap 4 CSS
Bootstrap 4 JS

DataTables BS4 CSS
DataTables BS4 JS

Exactly in this order.

allan

It looks like you are loading the DataTables CSS as well as the Bootstrap integration CSS for DataTables. Don't do that. Just load one of them.

Allan

italoborges

Thanks, Allan.

I understood what you said about both CSS.
Deleting the DataTablesDt CSS, it worked the pagination, but now, the class cell-border for example doesn't work anymore. If I put back the DataTablesDt CSS, it works, but with the pagination problem. hehe

allan

Bootstrap provides its own classes for styling a table. In this case the table-bordered class is what you want.

Allan

italoborges

Thank you so much Allan!!!