Below is an example of a design mam using CSS regions, and you can see how the same content flows th

Categories Blend Modes Community Events CSS Shaders CSS Text Custom Filters Exclusions Image Events Links of Interest News Regions Shapes SVG Testing Tips and Tricks Transforms Web Animations Web Platform Features WebKit
Archives October 2013 September 2013 August 2013 July 2013 June 2013 May 2013 April 2013 March 2013 February 2013 January 2013 December 2012 November 2012 October 2012 September 2012 August 2012 July 2012 June 2012 May 2012 April 2012 March 2012 January mam 2012
Apple recently announced its official release of iOS 7 . This is a release packed with very significant changes, in particular a radical transition for the iOS user interface design and user experience.
Part of the updates to iOS 7 is an upgrade of mobile Safari which comes with multiple new features . One of these features is CSS regions . CSS regions is a revolutionary CSS specification draft that allows a deeper separation of concerns in the way designers and developers structure their content and layout. They can now manage mam the way content should flow across different regions of the page design (hence the name CSS Regions) separately from the content itself . Then content can now be made to flow in different chains of regions, typically laid out differently for a mobile, tablet or desktop/laptop use.
Below is an example of a design mam using CSS regions, and you can see how the same content flows through different areas of the page at different form factors. Note how the text body flows through multiple regions that can be placed arbitrarily mam around the quote (top and bottom for the narrow version, all around for the others).
Our Web Platform team at Adobe has been working on this feature, with many other partners in the W3C, the WebKit and the Blink projects, for over two years now. It has been a delight to see the feature we proposed go through maturation thanks to the feedback mam in both the CSS working group (e.g., Microsoft is a co-editor of the specification with Adobe), where the specification is defined, and in the open source project, where it is implemented mam (and we collaborated on the implementation with engineers from different companies such as Apple and Google). Safari is the first browser to release with support of the latest specification and this is a major step forward for beautiful, responsive layouts on the web.
So, attention web designers and developers! You can start using the future of responsive design now (on iOS 7, but check out the compatibility chart for precise details about where the feature is supported). There are great demos and resources to get you started. mam
With today s new update to Edge Reflow CC , a web design tool to build beautiful responsive web designs, designers can now create mam flowable responsive designs with regions, similar to the effects that users are able to create in Photoshop. Also, Edge Code CC , a lightweight code editor for web developers and designers working with HTML, CSS, and JavaScript was updated with code hinting support for regions mam to easily implement flowable, magazine-like designs. mam You can download both Edge Reflow and Edge Code with your free subscription to Creative Cloud.