FixedButtons... (or how to keep buttons from scrolling)?

cptdeadpool

I've just started with datatables and while I have integrated FixedHeaders and can get that to work, I was wondering if there is anyway to also keep the buttons from scrolling as well (i.e. keep them with the fixed header).
Thx

kthorngren

I haven't tried it but there is the fixedHeader.headerOffset that might help.

Kevin

allan

As in the buttons added by the Buttons extension? Currently no, sorry, the there is no way to have them fixed like there is with the header at the moment. That is something that might be added in future.

The header offset parameter mentioned by Kevin is used when you have a position: fixed element at the top of the page and you want to offset the header by that amount.

Allan

F12Magic

Is this really not possible @allan ? I just tried setting the css rule position: fixed on the button-group and it just stays in place.

.dt-buttons.btn-group {
    position: fixed;
}

See example at codepen
Adding a little more styling gives you an even more standing out button group. Notice how I put the length combo, buttons group and global filter box on one line with minimal css modifications.

Hope this helps.

allan

I should have qualified my statement better. I meant that within the context of FixedHeader it is not possible. For example in FixedHeader the table header can scroll off the bottom of the screen when the table is below the fold. That isn't possible with position: fixed where it is always shown at all times on the screen. position: sticky is what we really want, but that has very limited support across browsers.

ALlan