Bootstrap 5 and Fixed Columns
Bootstrap 5 and Fixed Columns
ordco_pete
Posts: 8Questions: 3Answers: 0
Link to test case: https://live.datatables.net/qejasoli/1/
Error messages shown: None
Description of problem:
Link to Bootstrap Page: https://getbootstrap.com/docs/5.3/content/tables/#table-group-dividers
Hi
This is really minor. Not sure if this is a supported Bootstrap Feature (class) so might not be an issue at all.
When including the Fixed Columns extension (its css) with Bootstrap the <tbody class="table-group-divider"> does not work. If removed it works - above test case. It does not enable the extension.
Seems to be:
table.dataTable {
border-collapse: separate;
}
I dont use Fixed Columns but load all extensions due to laziness and I could not work out why I could not use the class on tbody for something I am working on.
Let me know if you need more information or I missed something obvious.
Thanks for a great product
Pete
This question has an accepted answers - jump to answer
Answers
Hi Pete,
This is a slightly tricky one! The
table-group-dividerclass is applied to thetbody, but it is the header that is floating. If the style was on the header, then it would be trivial, but its on the wrong element for a floating header!What I would suggest is using:
You could add a specific class to the table if you wanted,
table-strong-headeror something like that, if you want to be able to enable / disable this look with a class name.To have it happen automatically I could detect the class and then apply it to the header, but it feels like a workaround (even more than adding the custom CSS above)!
Allan
Awesome - problem solved
Thanks so much !!