Problem with header using Datatables inside jQuery UI Tabs and scrolling
Problem with header using Datatables inside jQuery UI Tabs and scrolling
fcaceres
Posts: 5Questions: 0Answers: 0
Hi All,
I am using many datatables inside several jQuery UI Tabs and I have a problem with the headers of every table while using YSCROLL. They completelly get missalign and seem to float a bit to the left while the tbody remains constant. When I click on the header the header gets magically aligned. The headers should be aligned from the begining so the user has a better user experience. I tried modifying several selectors but I had no luck. I have included a screenshot of the problem here: http://fcaceres.net/problem_datatables.png .
If you have any idea on how to correct that problem Please help.
Thank you in advance.
Fred.
I am using many datatables inside several jQuery UI Tabs and I have a problem with the headers of every table while using YSCROLL. They completelly get missalign and seem to float a bit to the left while the tbody remains constant. When I click on the header the header gets magically aligned. The headers should be aligned from the begining so the user has a better user experience. I tried modifying several selectors but I had no luck. I have included a screenshot of the problem here: http://fcaceres.net/problem_datatables.png .
If you have any idea on how to correct that problem Please help.
Thank you in advance.
Fred.
This discussion has been closed.
Replies
Making several test I'm now sure the bad interaction is caused by the use of the tab.
I had to workaround the issue using the Kirk's way on the Kobayashi-Maru test. I've changed the user requirement. Now he wants an accordion, and it works fine.
Notice that it work properly on the first tab, but the second tab is where the display is not correct.
Any help would be appreciated.
Allan
Thanks for posting that. I just now saw the example and was going to post a reply. My example has been updated with the fix: http://jsfiddle.net/hn32d/3/
Thanks again.