search

DataTables / DataTablesSrc

DataTables source repository
https://datatables.net
MIT License
628 stars 423 forks source link

Bootstrap 5 table-striped corrupted by dataTables.bootstrap5.scss when rowGroup is used #200

Closed programatix closed 2 years ago

programatix commented 2 years ago

I'm using the following,

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs5/dt-1.11.5/r-2.2.9/rg-1.1.4/datatables.min.css"/>
<script type="text/javascript" src="https://cdn.datatables.net/v/bs5/dt-1.11.5/r-2.2.9/rg-1.1.4/datatables.min.js"></script>

When I enabled rowGroup, the table-striped is corrupted as such, image

I noted that all effected even rows has the following, image

I tried linking the css individually and if I removed dataTables.bootstrap5.css, then table-striped works fine even with rowGroup (both its css and js).

AllanJard commented 2 years ago

It appears to work okay in this example.

Perhaps you could open a support thread in the forums with a link to a test case showing the issue please?

programatix commented 2 years ago

I managed to replicate the issue using the example linked above. Further tests shows that the issue is actually with the incompatibility with Boostrap v5.1.2 and above. Reverting to Bootstrap v5.1.1 and below will get good result.

I attached the zip file containing the html test file. test rowgroup+bootstrap5.1.3.html.zip