CSS Regions running in Chrome 15

The latest release of the Chrome browser (15 was launched last night) makes Chrome the first browser that offers support for the CSS Regions feature. This is really amazing as the story has been developing for a little bit more than a year: from the initial idea, to the first proof of concept, then working with the standards bodies and WebKit, and finally to Chrome 15.

If you have the latest Chrome on your machine (should work on both Windows and Mac OS) you should be able to test this page. Just play with the size of your browser window and you should see how the text fills the three different columns.

PS. Just talked to the Adobe engineers that work on this and they told me that there might be a small glitch with how the text flows sometimes. But this has been already been fixed in the main line. So probably the next update of the Chrome will pick up this change.

Later Update: Peter Elst dropped me a message telling me that the CSS Regions examples we host on Adobe Labs don’t work in Chrome 15. This is true and normal at the same time. The examples we have there represent one of the first drafts of CSS Regions. Since then the syntax has changed. This is why I included a page for test in my post.

Later Update 2: Someone told me that Internet Explorer 10 already supports CSS Regions. This is true, but IE 10 is a pre-release version while Chrome 15 is a “production” ready release.

3 thoughts on “CSS Regions running in Chrome 15

  1. First of all congrats to Adobe for this great proposal to the W3C. This is truly incredible. I’ve been playing around these features since they first appeared in Webkit. For me CSS regions and CSS exclusions are the first step into Web-to-Print without having to use the also remarkable ;-) Indesign Server. As a founding member of the Open Source cross-media publishing system pimcore (pimcore.org) this is quite a great outlook…

    For creating print-ready PDFs we currently use server-side wkhtmltopdf and phantomjs and the integration of CSS regions and exclusions in these tools will provide great new possibilities.

    By the way: For creating print-layouts, TOCs, page numberings, headers and footers it would be great to know (reflected in the DOM and accessible via Javascript) into which region certain content is being rendered. But that are just my two cents…

    Cheers from Austria

Leave a Reply