{"id":563,"date":"2009-12-27T11:21:34","date_gmt":"2009-12-27T17:21:34","guid":{"rendered":"http:\/\/www.mooreds.com\/wordpress\/archives\/000563"},"modified":"2009-12-27T11:21:34","modified_gmt":"2009-12-27T17:21:34","slug":"whitespace-and-tables-in-ie","status":"publish","type":"post","link":"https:\/\/www.mooreds.com\/wordpress\/archives\/563","title":{"rendered":"Whitespace and tables in IE"},"content":{"rendered":"

I was using the excellent displaytag library<\/a> recently, and had written a table decorator<\/a> to append some information about each row for a GWT widget to read and use<\/a>.\u00a0 The table ended up looking like this:<\/p>\n

<table>
\n<tr>
\n<td>data<\/td>
\n…
\n<\/tr>
\n<script type=”text\/javascript”>var …<\/script><span id=’uniqid’ style=’display:none’>gwt config data<\/span>
\n<tr>
\n<td>data<\/td>
\n…
\n<\/tr>
\n<script type=”text\/javascript”>var …<\/script><span id=’uniqid’ style=’display:none’>gwt config data<\/span>
\n…
\n<\/table><\/p>\n

This worked fine in Firefox and Safari, but IE (versions 6, 7 and 8 ) were displaying whitespace above the table.\u00a0 I couldn’t figure out why, until I commented out the table and the whitespace went away.\u00a0 Then I re-enabled the table, and commented out the finishRow<\/code> method; the whitespace was still gone.<\/p>\n

The answer, of course, is that IE doesn’t like stuff outside of the <tr> tags.\u00a0 Once I wrapped the span tag in <tr><td> tags, the whitespace went away for all browsers:<\/p>\n

<table>
\n<tr>
\n<td>data<\/td>
\n…
\n<\/tr>
\n<tr><td><script type=”text\/javascript”>var …<\/script><span id=’uniqid’ style=’display:none’>gwt config data<\/span><\/td><\/tr>
\n<tr>
\n<td>data<\/td>
\n…
\n<\/tr>
\n<tr><td><script type=”text\/javascript”>var …<\/script><span id=’uniqid’ style=’display:none’>gwt config data<\/span><\/td><\/tr>
\n…
\n<\/table><\/p>\n

[tags]ie html quirks[\/tags]<\/p>\n","protected":false},"excerpt":{"rendered":"

I was using the excellent displaytag library recently, and had written a table decorator to append some information about each row for a GWT widget to read and use.\u00a0 The […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[37,20],"tags":[],"class_list":["post-563","post","type-post","status-publish","format-standard","hentry","category-tips","category-web-applications"],"_links":{"self":[{"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/posts\/563","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/comments?post=563"}],"version-history":[{"count":0,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/posts\/563\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/media?parent=563"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/categories?post=563"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/tags?post=563"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}