Also sprach Leo Koppelkamm:
> currently the spec suggests that if height is constrained, content
> should be rendered outside of the column box (overflow columns).
Yes.
> If you put two column boxes next two each other the overflowing
> content is rendered over the next column. (Example:
> http://jsfiddle.net/sHyzL/31/embedded/result/ )
Within the same multicol element, column boxes are laid out so that
they do not overlap. But you will may get overlapping content if you
place two multicol elements with overflow next to each other -- just
like you may get overlapping content if you place two other elements
with overflow next to each other.
> This is ugly and makes some layout impossible to realise:
>
> Imagine a site where two articles sit next two each other. Their boxes have a max-height.
> The text-length varies. Sometimes the text fits in one column,
> sometimes not. ( Mockup:
> http://leo-koppelkamm.de/public/Overflow-Layout-01.png )
>
> I propose an extension to the overflow property: a new value
> "expand". In the context of columns it would resize the bounding
> box until the content safely fits in.
Would this override the set width? For example, how wide would this
element be?
<div style="columns: 3; height: 100px; width: 600px; overflow: expand">lots of content .... </div>
Typically, the elements that are constrained in height have an auto
width and no other elements on the side. In a browser, the overflow
content is then slightly hidden behind a scrollbar. Like in this case:
http://people.opera.com/howcome/2013/tests/multicol-height.html
Which I think is reasonable behavior. (In paged media, the extra
content can be placed on a subsequent page.)
Have you considered the overflow: paged-x/paged-y values?
http://dev.w3.org/csswg/css-gcpm/#paged-presentations
They avoid overlapping content by introducing paged.
Cheers,
-h&kon
HÃ¥kon Wium Lie CTO Â°Ã¾eÂ®Âª
howcome@opera.com http://people.opera.com/howcome