CSS3 multi column layout IE workaround [closed]

Question

I've stumbled across a really great project (CSS3 PIE) today that makes it possible to use CSS3 rounded corners, shadows and gradients even in IE6, IE7 and IE8 using CSS settings and usual CSS3 notation.

It uses *.htc file that does the trickery and makes it really transparent for developers (as in set it and forget it - no additional script calls when creating new pages or changing existing ones (provided you don't change CSS)).

I wonder if there's anything similar for multi column layout that can be used. Floating is not an option because content is not laid out top to bottom - left to right, but rather left to right - top to bottom...

Anybody developing something similar for CSS3 multi column layout?

Answer 1

Maybe the Columnizer jQuery Plugin?

Unfortunately, it doesn't parse your stylesheet and look for the relevant properties like CSS3 PIE does (a very convenient feature).

Both CSS3 PIE and that plugin rely on JavaScript.

Answer 2

Another solution for lists that should flow in column order (as in phonebooks)

I asked the question mainly because I had to display a list of about 1000 users. This kind of list is very long and involves a lot of scrolling. So I needed a solution to put these users in columns so they also flow from top to bottom column by column from left to right. CSS3 multi-column layout provides exactly what I need, but browser support is the problem. They're still not supported on IE9 and my users mainly use IE (8 or 9). Hence I needed a solution to work using CSS2.1

That's the reason I've written a jQuery plugin that takes a set of elements that are either set to float: left/right; or display: inline-block; and transposes them so they're ordered in the order of column layout.

Plugin reorders elements and doesn't add any column wrappers or anything. It just rearranges elements so they seem to be flowing in columns instead of rows.

You can check my blog post where the problem is detailed and you can also see a working example that rearranges/transposes US States. Or you can also watch the project on GitHub and get updates when a new version is out (or report issues you may have with it).