Column alignment with ScrollY

Freedy

Hi,

I have a table which works perfect until I use scrollY, I've tried using columns.adjust()
with no luck. Any suggestions?

Thnx!

kthorngren

It works good here:
https://datatables.net/examples/basic_init/scroll_x.html

The problem is likely specific to your environment. Maybe you can post a link to your page or a test case showing the issue:
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

Freedy

Hi Kevin,
But I'm using scrollY not scrollX.

-Thomas

kthorngren

Sorry, this example of scrollY works:
https://datatables.net/examples/basic_init/scroll_y.html

Again, something in your environment, CSS conflict or CSS missing, is causing the issue. Can you post a link showing the issue?

Kevin

Jigar

Many people actively suggested solutions around the issue with column alignment while using ScrollY. I struggled a lot to resolve this because in my case, the datatable is inside a container div whose width changes as the adjacent container expands or contracts.

I got a work around by setting the scrollHeadInner.width the same as ScrollBody.width using Jquery. Below is my function. I used setTimeout to delay as my container took around 600-700ms to fully expand

function adjustTableCol() {
        //Workaround to adjust datatable column alignment
        setTimeout(function(){
            var currentScrollBodyWidth = $(".dataTables_scrollBody .table").width();
                $(".dataTables_scrollHeadInner .table").width(currentScrollBodyWidth);
        },1000);
    }