Solution to "display:table-row" causing pain and suffering with IE

I recently came up against a sit­u­a­tion where I wanted to add rows to a table via javascript.

Not a prob­lem with jQuery, EXCEPT that my table rows were being added with ‘style=”display:block”‘.

What’s wrong with that, you ask? Well, in Fire­fox the row was being appended to the table but it looked all scrunched into the first cell like so:

borkedtablerow

OK, fine. Let’s give it a dis­play prop­erty of “table-row.” That should work, right? Yes, it works here but not in IE. IE hates this, in fact. IE wants to get a dis­play of “block.”

The solu­tion turns out to be to set the dis­play value to an empty string. Then, each browser will give the row its default value and every­one is happy.

source: http://cormacscode.wordpress.com/2008/11/28/show-hide-table-row-in-firefox-versus-ie/

Like it? Tweet it!

This entry was posted in Code and tagged . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

Post a Comment

Your email is never published nor shared. Required fields are marked *

Connect with Facebook

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>