Re: [css-regions] responsive and semantic use of named flows

Brad Kemper wrote:

 > > I'm happy to be proven wrong on my predictions. How would you use
 > > Regions to create a flexible and adaptive presentation of the example
 > > in the WebPlaform article?

 > Sorry, I lost track of which article you mean. 

Sorry for not including URLs. Here is the article:

 [1] http://docs.webplatform.org/wiki/css/tutorials/css-regions

and here's the example:

 [2] http://letmespellitoutforyou.com/samples/region_mq_sample.html

I'm discussing the example:

 [3] http://alistapart.com/blog/post/css-regions-considered-harmful

 > But in general, to create an adaptive flexible layout out of
 > existing content, I would use existing methods to do so (use
 > whatever boxes are already in the HTML, maybe add some more boxes
 > using ::before and ::after) or use something like Grid to generate
 > new boxes as needed.
 > 
 > Then I'd flow the content between the boxes in the way that suited
 > me.
 > 
 > Then I'd use whatever means I can (which have nothing directly to
 > do with Regions) to make it adapt to different devices. That would
 > include media queries, auto and/or percentage widths, floats
 > (including page floats, perhaps), etc.
 > 
 > For mobile phones, I might even flow multiple non-siblings parts
 > into a single 1-col box, and hide or collapse away their original
 > boxes.
 > 
 > Maybe for printing on a standard size page (selected with media
 > queries) I could turn the first page of the each article into a
 > fancy layout with multiple boxes (created via Grid, let's say) and
 > the text flowing through them (flowing into multi-col on subsequent
 > pages, if there is more to show) and a big page floated figure on
 > page one.

It would be enlightening to see how you would encode [2] using these
methods.

-h&kon
              Håkon Wium Lie                          CTO °þe®ª
howcome@opera.com                  http://people.opera.com/howcome

Received on Monday, 27 January 2014 01:17:31 UTC