forked from mirrors/gecko-dev
Automatic update from web-platform-tests Handle resumed blocks that get sliced by floats correctly. Floats may be pushed from one fragmentainer to the next, and thus get in the way for blocks that started in the former fragmentainer, which means two things: 1. The resumed block may not start at the fragmentainer block-start (this was already working correctly) 2. The resumed block may not be able to fit anything at all in the next fragmentainer (if the float is tall enough). This was failing. We'd end up inserting a break before a node that we had already started, causing a lot of trouble. We'll now allow fragments of resumed blocks even if we're out of space (their block-size will typically be 0, i.e. no visual effect). We cannot just break before them, as that would restart layout from scratch once we get to a fragmentainer that has room (and a lot of other weirdness, e.g. confusing anyone trying to use the break token sequence numbers). As for the crash test included in this CL, we'll actually fit a portion of the nested multicol container below the content edge of the float in the first fragmentainer, and then resume the rest after the tall bottom padding of the float (which gets pushed to the second outer fragmentainer, since it's unbreakable). This is a bit weird, but probably acceptable. Bug: 1289532 Change-Id: I6f564652aca170b3cba80a3e01209984be206f95 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3469462 Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#972587} -- wpt-commits: c4685f7e4b654d5ee7a1b37466286e782747d2b9 wpt-pr: 32876
10 lines
674 B
HTML
10 lines
674 B
HTML
<!DOCTYPE html>
|
|
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
|
|
<link rel="help" href="https://www.w3.org/TR/css-break-3/#varying-size-boxes">
|
|
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
|
|
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
|
<div style="columns:4; column-gap:0; column-fill:auto; width:100px; height:100px; background:red;">
|
|
<div style="height:70px; background:green;"></div>
|
|
<div style="float:left; break-inside:avoid; width:100%; height:50px; background:green;"></div>
|
|
<div style="display:flow-root; width:100%; height:280px; background:green;"></div>
|
|
</div>
|