scrollx make tbody position not match thead

t0n1zz

so i use scrollx since i have a lot of column (maybe around 20) and i find that there is some bug in it... it just render my content (tbody) position not match thead(column header)...

allan

Thanks for your question - however, per the forum rules can you link to a test case showing the issue please. This will allow the issue to be debugged.

Information on how to create a test page, if you can't provide a link to your own page can be found here.

Thanks,
Allan

riede

Hi,
I have the same issue that t0n1zz describes. I've tried to create an easy example to reproduce it but it doesn't work. However, here is the example on jsfiddle. The issue occurs with Firefox 48.0.1, Internet Explorer 11 & Edge - and only then if "scrollx" is enabled and "autowith" is disabled with a big number of columns (in my case 203 columns). The other browsers (Chrome, Opera & Safari) don't screen the issue.

Thanks,
Peter

allan

Can I ask why autoWidth is disabled? I've been thinking about removing that option.

Allan

riede

I've found a solution to prevent described issue:
- add the options flag 'width' to the first column. (e.g. "width": "5%")
- enable autowidth

That works for me :-) Btw.: I'm using version 1.10.12.

@allan "autowidth" makes some strange things once i set the visibility of many columns to false (columns().visible(false, false)). It looks something like this:

| header column 0 | header column 1 |

| row 0,0 | row 0,1 |

| row 1,0 | row 1,1 |

The table doesn't fill the available space. The header row is left orientated - the data rows are in center.

In addition, if you remove that option, the function columns.adjust() is waste, isn't it?

allan

If you could give me a link to a page showing that issue I'd be happy to take a look. If you don't currently have either style="width:100%" or width="100%" in your table's HTML tag, could you add that.

Allan

t0n1zz

okay i think i have a little understanding about the issue... it only happen if my header character is less then body character in the column... so if my header is "username" and my body for username column is "the mystical username" then it will show the exactly same issue like that...

and yes i already do autowidth and add width = 100%

so my workaround is just make header have more character... but it maybe not a very best way... ahahaha