W3C home > Mailing lists > Public > www-style@w3.org > July 2013

Re: [css3-multicol] column rules drawn between adjacent columns

From: Morten Stenshorne <mstensho@opera.com>
Date: Mon, 22 Jul 2013 11:50:02 +0200
To: www-style@gtalbot.org
Cc: Håkon Wium Lie <howcome@opera.com>, "www-style mailing list" <www-style@w3.org>
Message-ID: <871u6q53g5.fsf@aeneas.oslo.osa>
"Gérard Talbot" <www-style@gtalbot.org> writes:

> "
> Column rules are only drawn between two columns that both have content.
> "
> http://www.w3.org/TR/css3-multicol/#column-gaps-and-rules
>
> but there is an exception later described:
>
> "
> [Example XVII]
> If a tall image is moved to a column on the next page to find room for it,
> its natural column may be left empty. If so, the column is is still
> considered to have content for the purpose of deciding if the column rule
> should be drawn.
> "
> http://www.w3.org/TR/css3-multicol/#column-rule
>
> First of all, the word "is" appears twice:
>
> "(...) the column is is still considered (...)"
>
> Second, I am not entirely sure what is meant by "natural column" in
> Example XVII; it seems to be the column box of first row, with the second
> row being on next page. For sure, I would want to see a real example with
> code here.

Example with nested multicol:

        <div style="columns:2; column-fill:auto; height:350px; background:wheat;">
            <div style="height:200px; background:salmon;"></div>
            <div style="columns:2; column-fill:auto; column-rule:1px solid; orphans:1; widows:1; background:olive;">
                line<br>
                <img style="display:block; height:250px;" src="http://www.apekatt.com/img/lolgorilla.jpg">
            </div>
        </div>

In the outer multicol, in the left column, there should be a salmon box,
then a line with a column rule to the right of it. In the right outer
column there should be a gorilla, which has been pushed to a next inner
row, because there wasn't enough room for it in the first row.

Yes, the term "natural column" may need some further definition. What's
the natural column for the gorilla? Probably the first inner column,
just below the line of text? It doesn't fit there. It doesn't fit in the
second inner column either (is that the natural column?), so we have to
create a new row for it.

As far as I can tell, this doesn't render correctly in any
browser. Presto is pretty close, but fails on the exact point we're
discussing here: it doesn't draw that column rule (since there's no
content in the second column).

> "next page to find room for it" suggests that such example can only happen
> in paged media.

I think any kind of enclosing fragmentation context should do. In my
example I use nested multicol. But one could also use paged media or
regions?

-- 
---- Morten Stenshorne, developer, Opera Software ASA ----
---- Office: +47 23692400 ------ Mobile: +47 93440112 ----
------------------ http://www.opera.com/ -----------------
Received on Monday, 22 July 2013 09:50:23 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:32 UTC