Files
tubestation/layout/reftests/pagination/column-balancing-break-inside-avoid-2-ref.html
Ting-Yu Lin a93325236a Bug 793686 Part 1 - Don't set mIsTopOfPage on -moz-column-content during column-balancing. r=emilio
According to `nsContainerFrame::ShouldAvoidBreakInside`, we allow a frame to
break from inside when it is at the top of page/column, i.e. when `mIsTopOfPage`
is true.

This patch allows the content at the top of the column to honor the
break-inside:avoid during column balancing, so it can now propagate the
break-before status to nsColumnSetFrame if it needs to report such status.

We don't need to worry about disallowing an break-inside:avoid content from
breaking will trap the column balancing algorithm forever. If the content's
block-size is larger than the column container's available content-box
block-size, then the column balancing algorithm will give up and fill the
columns sequentially at
https://searchfox.org/mozilla-central/rev/4f2984be127d2e7c788cf1848d63dca63022beec/layout/generic/nsColumnSetFrame.cpp#1146-1162

The reference files are modified to reflect the rendering as of this patch. Note
that browsers do not agree on the rendering of `1420528-1.html`. Before this
patch, our rendering is the same as Chrome by placing "Spacer" in the first
column, but now we agree with webkit by placing it in the second column.

The multicol in `611574-2.html` is used for visual separation of subtests. I
change it from column balancing to fill to workaround bug 1784002.

Differential Revision: https://phabricator.services.mozilla.com/D154048
2022-08-10 16:19:05 +00:00

32 lines
879 B
HTML

<html>
<head>
<link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=685012">
<link rel="help" href="http://www.w3.org/TR/CSS21/page.html#propdef-page-break-inside">
<meta name="flags" content="paged">
<meta charset="utf-8">
<title>Balancing Overflow, page-break-inside:avoid</title>
<style>
#colset { width: 200px;
padding: 2px;
column-count: 3;
column-gap: 2px;
column-fill: auto; }
#a { height: auto; background: lightblue;}
#b { height: 50px; background: lightblue;}
#c { height: 51px; background: orange;}
</style>
</head>
<!-- Removing whitespace in body for simpler frame trees -->
<body
><div id="colset"
><div
><div id="a"></div
><div id="b"
><div id="c"></div
><div id="d"></div
></div
></div
></div
></body>
</html>