Table header is not resizing when sidebar is hidden

infexo

Hello.

Dear datatables users.

I've added sidebar to page, where table is located. I'm using datatables plugin for this table.

Sidebar can be toggled or hidden. Problem occurs when I hide sidebar. Table body resizes correctly, but header doesn't. I can adjust header by clicking on it. By resizing, I meant that I change parent width like this:

width: calc(100% - 300px);

I read that columns.adjust() function might help, but it didn't. I don't have any more ideas how I can fix it.

I provide snippet: live.datatables.net/hafisufo/1/

How to resize table header or adjust it to tbody width ?

SOLUTION:

Fixed it by css.

.dataTables_scrollHeadInner, .table{ width:100%!important; }

infexo

Well, I can see that scrollY causes this problem. I've removed scrollY option and it resizes correctly, but it pushes me to use fixedHeader which does not work well on my page.

colin

Hi @infexo ,

If you use draw(), that resolves the issue - columns.adjust() does the calculations but doesn't update the table. See here.

Hope that does the trick,

Cheers,

Colin