It seems like it may not work with the Datatables library active. Also, chrome and edge can't stick the thead element, you have to target the elements instead.
@@BuildThatWebsite Very helpful video and code! Thank you very much. The sticky header code works for my table press tables in the Opera browser but not in Chrome. :(
@@BuildThatWebsite Hello! Thank you for the reply. I indeed used it on tr. In the code it's tr.row-1. In my tables the first row works as my table header but I'll try to change that now. Thank you for the tip and have a great weekend! :)
Hmm, I wonder if it's a browser support issue. Which browser are you using? One thing that can break sticky table rows is the overflow property. Trying setting the element to overflow: auto; and see if that fixes it.
Very Help full and informative video..
Very helpful, thank you.
I set the parameters exactly as in the video above, but the form doesn't respond at all. I don't know what's going on.
If the CSS is written correctly then the next step is to confirm it's actually being loaded on the page.
Great video...like to ask how can I make the first column sticky?
Many thanks #love#
Awesome video but sticky doesn´t work for me either. It is necessary to install the Extension DataTables FixedHeader..? Thank you!
It seems like it may not work with the Datatables library active. Also, chrome and edge can't stick the thead element, you have to target the elements instead.
@@BuildThatWebsite Very helpful video and code! Thank you very much.
The sticky header code works for my table press tables in the Opera browser but not in Chrome. :(
@@Dispatern Which element did you stick with CSS? Position sticky works with TH elements but not Thead or TR elements in chrome.
@@BuildThatWebsite Hello! Thank you for the reply. I indeed used it on tr. In the code it's tr.row-1. In my tables the first row works as my table header but I'll try to change that now. Thank you for the tip and have a great weekend! :)
sticky not work, by the way the video is awesome
.tablepress.compare tr.row-2 {
position: sticky;
top:0;
box-shadow: inset 0 -1px #ddd;
}
Hmm, I wonder if it's a browser support issue. Which browser are you using?
One thing that can break sticky table rows is the overflow property. Trying setting the element to overflow: auto; and see if that fixes it.