W3C home > Mailing lists > Public > www-style@w3.org > September 2015

{css-break] Float pushed to the next fragmentainer, what about its siblings?

From: Morten Stenshorne <mstensho@opera.com>
Date: Tue, 01 Sep 2015 14:51:57 +0200
To: www-style@w3.org
Message-ID: <87si6yjo9e.fsf@aeneas.oslo.osa>
When a float is pushed to the next fragmentainer (let's use multicol as
an example, so henceforth I'll use the term "column" instead of
"fragmentainer"), because it's unbreakable, and there's not enough space
remaining in the current column, should consecutive content also be
pushed to the next column, even if there's room for it in the previous


    <div style="columns:2; column-fill:auto; height:10em; orphans:1; widows:1;">
        line before float<br>
        <img src="http://home.powertech.no/mstensho/gfx/bilen.jpg" style="float:left; height:10em;">
        line after float, but in which column?<br>

Looks like I've been assuming that the answer is "yes, push everything
to the next column", seeing how I implemented it in Presto, but I cannot
find anything in the spec suggesting such behavior.

And I have a feeling that floats traditionally don't affect sibling
content in such ways; e.g.:

    <div style="float:left; width:99%; height:100px; border:1px solid black;"></div>
    <div style="background:hotpink;">
        This text is pushed below the float, since it doesn't fit
        beside it, but our block isn't pushed anywhere.

So the text ends up after the float, since no word would fit beside it,
although the block remained put. How about this:

    <div style="float:left; width:50%; height:100px; background:black;"></div>
    <div style="float:left; width:100%; height:100px; background:black;"></div>
    This text is preceded by a 100% wide float, but there's some room
    for text above that float, next to the 50% wide float, so we'll
    use up that space first.

OK, back to multicol. Gecko doesn't force consecutive siblings of such
floats to move the next column. Blink isn't consistent. If the float is
followed by inline content (text, for instance), it's pushed to the next
column along with the float (like Presto). However, if the float is
followed by a block, it stays put in the previous column (like Gecko).

So is it Gecko that does it right?

---- Morten Stenshorne, developer, Opera Software ASA ----
------------------ http://www.opera.com/ -----------------
Received on Tuesday, 1 September 2015 12:52:15 UTC

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