Bootstrap 5 table-bordered

binexline

Hello,

It seems like Bootstrap 5 table-bordered isn't working as expected. Horizontal lines disappear after datatable initializes.
Would there be any workaround for the horizontal border lines to also show?

Thank you,

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

binexline

Hi @colin ,

For example this example here https://datatables.net/examples/styling/bootstrap5.html

Even though table-bordered is applied, the horizontal lines are not there, as it should be showing as in this example https://getbootstrap.com/docs/5.0/content/tables/#table-borders

allan

It looks like our use of:

border-collapse: separate !important;

for the table is what is causing the issue. Unfortunately, we need that to be able to perform scrolling calculations. Removing (or overriding) that style will work just fine as long as you aren't using scrollX or scrollY, but it will cause misalignment if you do.

I'll need to look into this more in the new year.

Allan

binexline

Thanks @allan , Happy new year!

dfish

I'm having the same issue and this looks like it was an old post, was this ever resolved? I use the scrollY option and just upgraded to BS5 and my tables look awful

allan

Can you give me a link to your page please? This little test case of BS5 with scrollY looks okay.

Thanks,
Allan