In its ongoing quest to help publishers and designers adapt print-style layouts to the Web across devices, Adobe has admittedly run into a few limitations. As powerful as HTML and CSS are, they don’t yet offer the means to create layouts with unlimited flexibility like print designers can.
Not content to settle for what’s possible, Adobe has recommended some specifications to the W3C that will allow CSS to create much more fluid, flexible layouts.
CSS Regions is a module that builds on the column-based layout options now available in CSS3 to enable front-end developers to flow text across different columns (or “regions”) on a page. This allows for more dynamic page designs, which can shapeshift to fit different devices and device orientations on-the-fly.
The CSS Regions standard recently made its way into both the WebKit browser engine project and latest Chromium release, and will also be supported by Internet Explorer 10.
Another improvement to CSS proposed by Adobe is called Exclusions, which lets developers flow text into a non-rectangluar shape, or to wrap it around graphics on the screen, much like what’s been possible in desktop publishing for decades. Check out the video below for examples of these new standards at work.