JQuery Datatables misalignment in tabs with fixed columns
Problem: I am working with jQuery datatables for quite some time and i began to think it was bug free until i came across the misalignment issue. I was using jQuery datatables with jQuery UI Tabs, so only first datatable was shown when the screen loads, and first grid was displayed just fine. However when i view the second datatable, it shows header misalignment issues. I tried may workarounds but those only change the problems like if rows misalignment is fixed then header row height gets smaller etc. After spending a lot of time in searching, i found the cause of the problem and it was mentioned on jQuery datatables official site here . It is mentioned that if a datatable is initialized while it is not visible, browser will not be able to calculate the height and width of table. You can also view the question i have posted on StackOverflow for this problem here . I have posted images of problem there, that will help you understand it. Solution: In order to avoid this situa
