FixedHeader not bold but then bold after scroll activates sticky header
FixedHeader not bold but then bold after scroll activates sticky header
brycepfrimmer
Posts: 3Questions: 2Answers: 0
Link to test case:
Versions in link , this is only present when using jquery UI for styling, not when using DataTables' default styling.
https://datatables.net/download/#ju-1.13.2/jq-3.7.0/jszip-3.10.1/pdfmake-0.2.7/dt-2.3.7/b-3.2.6/b-colvis-3.2.6/b-html5-3.2.6/b-print-3.2.6/cr-2.1.2/fc-5.0.5/fh-4.0.6/kt-2.12.2/r-3.0.8
Then use StackBlitz to run the sample - I ran without min or concat so that browser web inspector can be a little more helpful.
(let me know if there's a better/preferred way of creating a live demo reproduction)
On new up of the DataTable add "fixedHeader: true", set page length to "100" so that you can scroll.
Description of problem:
When page loads up, the header fields are font-weight: normal. When scrolled down so that the sticky header comes into play, it has font-weight: bold. I don't think this is intentional as it's not the behaviour using other styling.
From datatables.jqueryui.css
Line: 893
div.dt-container .ui-widget-header {
font-weight: normal;
}
Line: 435
table.dataTable thead th, table.dataTable tfoot th {
font-weight: bold;
}
Because the sticky header doesn't fall under the div id="myTable_wrapper", the font-weight: normal doesn't override the bold.
This question has an accepted answers - jump to answer
Answers
Not intentional, as you say. The jQuery UI stylesheet inherits a lot from the DataTables default, and this is another case of a style that shouldn't be set, just like the FixedColumns one the other day.
This is a test case that shows the issue: https://live.datatables.net/yiwezenu/1/edit .
For test cases, the best way is to give a link to a running example. That can be on https://live.datatables.net , JSBin, JSFiddle, CodePen, etc, etc.
I'll take a look into this next week. Thanks for flagging it up.
Allan
Committed a fix for this issue here and it is now in the nightly. An updated example shows it no longer switching the header text to bold (or changing the padding) when floating the header.
Allan