Flexigrid for Dynamic Tables: an Internet Explorer Pitfall

Flexigrid is a javascript utility built on top of jQuery UI which lets you do interesting things with html tables, including dynamic loading, sorting, and both row & column re-ordering.

The canonical example deals with populating tables based on server queries, but there are also ways of using it client-side, for static table data.

jQuery is mostly cross-browser, so I wasn’t particularly concerned about how it would render.

Still, I did take the time to use Adobe’s Browser Lab tool, and I’m glad I did.

Things looked good in all versions of Firefox, Safari, and even Chrome.

So it was annoying but unsurprising that Internet Explorer looked terrible, in both versions 7 and 8 (it also looked bad in the P.O.S. known as version 6, but that’s to be expected).

Fortunately, though, the solution was simple:

Note: for this method to work in Internet Explorer (version 6 and later only), the document must use a DOCTYPE that forces IE to use its standards mode. Please read Fix Your Site With the Right DOCTYPE! for more info.

Thanks to: 456 Berea Street and A List Apart.

Visit FanStockExchange.com to see the results, unless you’re still using IE 6 (seriously, you should dump that browser for your own good).

Tags: , , , ,

Share on Facebook Tweet This Share on LinkedIn Share on Google+ Share on reddit Share on Pinterest

Leave a Reply