Internet Explorer 9 not rendering table cells properly

I have exactly the same problem as well. you may want to read this https://connect.microsoft.com/IE/feedback/details/649949/innerhtml-formatting-issues-on-very-large-tables

YOu can remove the space inbetween td by using javascript if your html is returned from ajax, then from the response, you replace it with

response_html = response_html.replace(/td>\s+<td/g,'td><td');$('#table').html(response_html);

I had the same exact issue populating a table using jquery templates. I kept having 'ghost' <td>'s on larger datasets (300+) only in IE9. These <td>'s would push the outer columns outside the boundries of my table.

I fixed this by doing something really silly; removing all the spaces betwen the <td> start and end tags and left justifying the HTML markup pertaining to my table. Basically, you want all of your <td> </td> on the same line, no spaces.

Example:

<table><tr class="grid_customer_normal"><td>${primary}</td><td>${secondary}</td><td>${phone}</td><td>${address}</td></tr></table>

The solution given @Shanison helps only partially but the problem persists if there are spaces between any of the other elements that can be part of the table content model like thead, th etc.

Here is a better regex devised by my Lead at work.

if (jQuery.browser.msie && jQuery.browser.version === '9.0'){    data = data.replace(/>\s+(?=<\/?(t|c)[hardfob])/gm,'>');}

covering all table, caption, colgroup, col, tbody, thead, tfoot, tr, td, th elements.

Note: jQuery.browser was removed in jQuery 1.9 and is available only through the jQuery.migrate plugin. Please try to use feature detection instead.