Internet Explorer 9 anchor tag bug

Ironwil616

If there are anchor tags in dataTables when rendered in Internet Explorer 9, mousing over the links causes what appears to be a whitespace area to be added to the bottom, below the table itself. The area that gets added is approximately equivalent to one line in the table, but it's added under the entire table area, not in it. This repeats each time an anchor tag is hovered over. It seems to be related to the CSS rule of overflow:auto that is applied to the generated div with class "dataTables_scrollBody". If I remove this rule, of course the table then extends horizontally past where it is supposed to end, but the extra whitespace no longer gets added beneath the table.

My table setup is: server-side processing, ColVis and ColReorder plugins used, ScrollX used. I've tested this in Opera, Chrome, FireFox, and Internet Explorer 8 & 9. It only seems to occur in Internet Explorer 9, and only when anchor tags are rendered in the table.

Ironwil616

I found the fix for this problem. As stated in my original post, a problem was occurring with the overflow CSS. On a hunch I popped in the CSS3 rule:

overflow-x: scroll;

I put this in right after the 'overflow: auto' rule, figuring that older browsers would just ignore it. It worked great. Unfortunately, I had a difficult time finding the place in the dataTables plugin where this could be added. I found where 'nScrollBody.style.overflow = "auto"' was set, but when I tried to just add in another rule, it caused the app to break. So, I took the easier route and added this to my dataTables init code:

[code]
"fnDrawCallback": function() {
$(".dataTables_scrollBody").css("overflow-x", "scroll");
}
[/code]

Problem solved.

username

OML... thank you for providing this information!!!!!!!!! I've been bashing my head in trying to fix this problem. I haven't tested your solution yet but at the very LEAST you validate what I'm seeing in my table with anchor tags. Can't wait to get home tonight!!

** Confirmed fix **

I used this and it fixed the problem. Great find Iron!