Via Anne van Kesteren (again), I have found a site with a pure-CSS rendition of the Canadian flag (the image here in my blog is a screenshot, not the live CSS). It’s a little squished, granted, but at least it’s the right way up.
Now, let’s see the XSL-FO version of the Canadian flag: any volunteers?
Wouldn’t this rather be a job for SVG? Wherein it would be trivial to do, as well?
You are right that SVG (or Postscript), and not CSS or XSL-FO, is the easy way to do this. In this case, though, it’s an attempt to test the boundaries of a stylesheet’s layout capabilities (as with the Canadian flag I pointed to).
Just for grins, I tried pulling up that same code in IE and managed to get the following results… I may see if it can be tweaked to work.
It looks great with Firefox, but it’s a mess in IE6 (not surprising). Nevertheless, it’s a neat CSS trick.