mirror of
https://github.com/mozilla/gecko-dev.git
synced 2025-11-11 05:39:41 +02:00
fe4f74d1a8
Automatic update from web-platform-tests
[LayoutNG] Remove NGLayoutResult::PositionedFloats.
This patch does a few (related) things:
1) Makes floats children of their appropriate inline-level container.
Previously we weren't doing this, which was making OOF positioned
children skip their correct containing block. Now they'll correctly
get captured, during NGContainerFragmentBuilder::AddChild.
2) Now that float children are in the "correct" position within the
fragment tree, we can now paint them. This changes the
ng_box_fragment_painter.cc to paint inline-level floats and makes
sure we set the NGPaintFragment correctly.
3) Lots of subtle painting layer changes. As floats are now in the
"correct" fragment tree position, self-painting layers of
inline-level elements (spans, etc) need to know that they are able
to paint floats, determine position correctly, etc.
The major behaviour changes are:
<div>
text <span style="position: relative;">abc
<div style="float: left;">
<div style="position: absolute;"></div>
</div>
def</span>
</div>
The OOF positioned child will be contained within the <span>
<div>
<span style="position: relative; top: 100px;">
<div style="float: left;"></div></span>
</div>
The float will also shift by 100px, which previously wasn't the case.
Additionally filter: blur(2px); etc, will be applied to the float.
Change-Id: I61a2638cb1472f1a22f5994688d69fb6fffb8b88
Reviewed-on: https://chromium-review.googlesource.com/c/1365984
Commit-Queue: Ian Kilpatrick <ikilpatrick@chromium.org>
Reviewed-by: Chris Harrelson <chrishtr@chromium.org>
Reviewed-by: Morten Stenshorne <mstensho@chromium.org>
Reviewed-by: Koji Ishii <kojii@chromium.org>
Reviewed-by: Emil A Eklund <eae@chromium.org>
Cr-Commit-Position: refs/heads/master@{#619070}
--
wpt-commits: a1cc8c0bda2dc784ab07a34473c8f27d4bad7518
wpt-pr: 14582
10 lines
152 B
HTML
10 lines
152 B
HTML
<!DOCTYPE html>
|
|
<style>
|
|
div {
|
|
width: 100px;
|
|
height: 100px;
|
|
background: green;
|
|
}
|
|
</style>
|
|
<p>Test passes if there is green square.</p>
|
|
<div></div>
|