Hacker News Reader

Comment by macrael | Hacker News Reader

These are very real problems with current web technologies but Adobe's solutions seem a little strange. Content flow and region styling are both something that should be made easy to do in html and would make it easier to design great looking websites. But, the syntax they propose is weird. They put all the text in one div that is presumably hidden by default before being inserted into other divs that you leave empty in your source.

I feel like some sort of pure CSS solution would be better than requiring empty divs in the HTML, this further mixes content and presentation. (not that HTML/CSS does a perfect job of maintaining that separation at the moment, but I believe this proposal would be quite a departure.)

View on HN

For what it's worth, we're actively discussing this proposal in the CSS WG. There are several of us who would prefer an approach (anonymous ::slot pseudos or some such) which would allow for Zen Garden-like change of region styling without requiring the content to change.

I think it's an interesting solution. I think that CSS-only styling would be more difficult thanks to a lack of regions. This is more an "automated" way to get the browser to lay out the text within your content DIVs.

The good thing is, you can craft a layout and put in some placeholders that get filled with your content. The bad thing is, you probably could have done this yourself by hand rather than by using a CSS extension. The ugly thing is waiting for full browser support (border-radius STILL requires -webkit and -moz!) for these solutions.

How would you do this yourself? By using javascript?

By knowing the content you could style the regions of each page individually. This would, however, require something like a <style> element on the page to customize the regions or a stylesheet per page.

Or by javascript. But I see this as a more challenging approach than CSS. (Breaking a paragraph across 2 DIV elements would be a challenge.

If all you want is region layout, try http://robinmessage.github.com/regionjs/ I didn't follow the CSS format of the Adobe proposal, but that code will layout columns nicely.

I can see what you mean, but I can also see why Adobe chose this path. A pure CSS solution may offer the ability to simply define an array of boxes for the content to flow through. On the other hand the css box model requires html elements in the hierarchy to attach to, in order to manage the cascading aspect of css.

I agree, it is a sticky problem. Really, it does make sense to have the content areas defined by divs (though what to do if one of them ends up empty?) And once you've done that, where is the content supposed to go? I suppose then it makes sense for it to be in a separate hidden div... What happens to styles put on that div? Will the content div be represented in the DOM? I feel like it makes for some sticky questions.

Before this proposal, you might have attempted to implement these features server side; deciding what parts of which text should end up in each div. It's just unclear to me that having this hidden div is the best way to bring your text up to the browser.

Why not combine these into something like:

  <div style="columns:4;columnpadding:0.5em;">your content</div>

You just can't do that. You'll have no control of the individual columns. Adobe wants it to be more powerful than this http://www.quirksmode.org/css/multicolumn.html.

Still, if by using that, you're implying a pseudo class or something like #container:first-column and so on, there's risk of having a mismatch with regards to the number of columns defined on the parent.

Reply on news.ycombinator.com