Question

The IE9 layout engine has issues with tables. Whitespace seems at the root of it.

If you’ve seen the infamous ghost cell you know what I’m talking about, if you haven’t, consider yourself lucky and don’t worry about it.

Anyways, I’d really like an HTML only sample to test “fixes” on.

I know I’ve seen it before in odd circumstances several layout tables deep, but I can no longer get the ghost cell to come up when I need it to.

What I need is a consistent ghost cell without invoking JS.

I’ve found several JS related ones, and there are plenty discussion on those when it comes to sorting.

This is a great sample:

http://www.ncf.ca/ncf/support/ie9_issue/index.html

Some discussions:

http://social.msdn.microsoft.com/Forums/en-US/iewebdevelopment/thread/28d78780-c95c-4c35-9695-237ebb912d90

http://datatables.net/forums/discussion/5481/bug-ghost-columns-when-generating-large-tables/p1

http://datatables.net/forums/discussion/8248/datatable-in-ie-9-bug-with-large-tables/p1

Answer 1

I managed to clean up the html quite well and still keep the issue. I replaced all the javascript with equivalent spaces & newlines, and could remove most of the elements attributes without affecting the ghost-cell.

It seems like IE has a buffer problem since removing single spaces or newlines in a “safe area” cause the ghost cell to disappear, while removing entire attributes does not affect the rendering.

I see that you have unclosed tags, but I also managed to remove them altogether (replacing with spaces) without removing the ghost cell.

Result being I have a javascript-free html with ghost-cell. See result here: http://compscicon.no/ghostcell.htm