IE9 - One of the row's column shift right causing alignment issues

hpreets

I am new to Datatables but I must say, this has really been the grid that has allowed us to move from Flex to HTML and Javascript.

I have the use case where we need to have a freezed headers, header sorting and some filters. The number of records range from 10 to 1000. However in IE9, I see that whenever the records are above 300, one of the row's column gets shifted to right and hence causing alignment issues. This works fine in Chrome, Firefox and IE8 but gives issue only in IE9. Also the column shifting is not specific to one row but happens for any row. The pure HTML table without using Datatables renders correctly without any shifting.

I tested it that if I remove sorting option using bSort, it works fine but I require sorting option too.

Here is the code.

[code]
var teTable = $('#AccountTaskHistory__AccountTaskHistoryTable').dataTable( {
"sScrollY": "200px",
"bPaginate": false,
"bScrollCollapse": false,
"sDom": 'ti',
"aoColumnDefs": [
{ "bVisible": false, "aTargets": [ 6, 7, 8 ] }
],
"aaSorting": [[3,'desc']]
} );
[/code]

hpreets

Here is how it looks on IE9 - http://sdrv.ms/PTxSXb

hpreets

Can anyone please help me here.