CSS3 Layout Module Browser Support

Question

I'm trying to figure out which browsers currently (natively) support the CSS3 layout module.

Basically, I'm developing for a specific environment where I can specify what browsers to use, and CSS3 will speed up development times, so hey - why not?

What I'm specifically talking about is

body {
   display: 'aaa'
            'bcd';
}

and being able to slot page elements into the layout like so:

div#div1 { position: a; }
div#div2 { position: b; }

(div1 is the header, and div2 is a left sidebar)

Answer 1

Opera has the best CSS3 support, followed by webkit (safari). I suggest testing on Opera to see what works.

Here's a compatibility chart (may be out of date) http://geocities.com/seanmhall2003/css3/compat.html

this one seems better: http://westciv.com/iphonetests/

Be aware that most css3 properties are supported through a prefix (since css3 isn't final). For opera the prefix is -o- and for webkit it is -webkit-. ie: -o-text-shadow.

UPDATE: There is a Javascript implementation of the layout module: http://a.deveria.com/csstpl/ . Have not used it myself and it comes with the catch that you must wait for all the page to load before it can render cleanly. If you're writing an intranet application on a LAN this would probably have a negligible impact but on a slow connection that could make your pages appear unresponsive.

Answer 2

I'm pretty sure no browsers currently implement it. And I wouldn't expect any browser to implement it any time soon either.

It just isn't mature enough yet. It's only a working draft and will still need a lot of attention and discussion before it's going to turn into anything browser implementors will start having a go at. For example, there are (at least) 2 related proposals: Grid Positioning and Matrix Layout.

It is on Mozilla's bug tracker, but for the moment that's little more than a placeholder for future attention. I couldn't find any mention of it at all on the Webkit bug tracker.

If you want to find out more about the ongoing status of these layout modules, you should follow the www-style mailing list.