Auto merge of #7313 - pcwalton:position-relative-percentage-overflow, r=mbrubeck

layout: Make overflow calculation take relative percentages into account.

This necessitated changing overflow to be calculated by the parent flow
if relatively positioned children are present. That is because the
overflow regions cannot be calculated without knowing relative offsets,
which themselves cannot be calculated without knowing the parent size
(because of percentages). To accomplish this without sacrificing
parallelism in the non-relative case, this patch splits overflow into
"early" and "late" computation. Late overflow computation cannot be
parallelized across children, while early overflow computation can.

Makes the "Apple Music" text show up over the full-bleed promotional
background on apple.com.

r? @SimonSapin -- would appreciate a look over the iframe test case that was changed.

<!-- Reviewable:start -->
[<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/7313)
<!-- Reviewable:end -->
This commit is contained in:
bors-servo 2015-09-01 12:33:07 -06:00
commit dcaf66397a
19 changed files with 223 additions and 108 deletions

View file

@ -296,6 +296,7 @@ flaky_cpu == linebreak_simple_a.html linebreak_simple_b.html
== position_relative_painting_order_a.html position_relative_painting_order_ref.html
== position_relative_stacking_context_a.html position_relative_stacking_context_ref.html
== position_relative_top_percentage_a.html position_relative_top_percentage_b.html
== position_relative_vertical_percentage_overflow_a.html position_relative_vertical_percentage_overflow_ref.html
== pre_ignorable_whitespace_a.html pre_ignorable_whitespace_ref.html
== pre_with_tab.html pre_with_tab_ref.html
== pseudo_element_a.html pseudo_element_b.html

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<style>
body, html {
margin: 0;
}
#a {
display: block;
position: absolute;
top: 100px;
left: 100px;
width: 100px;
height: 100px;
transform: translateX(0px); /* force creation of stacking context */
}
#b {
display: block;
position: relative;
top: -50%;
width: 100px;
height: 100px;
background: purple;
}
</style>
<div id=a><div id=b>

View file

@ -0,0 +1,17 @@
<!DOCTYPE html>
<style>
body, html {
margin: 0;
}
#a {
display: block;
position: absolute;
top: 50px;
left: 100px;
width: 100px;
height: 100px;
background: purple;
}
</style>
<div id=a>

View file

@ -1,3 +0,0 @@
[abs-pos-non-replaced-vlr-069.htm]
type: reftest
expected: FAIL

View file

@ -1,3 +0,0 @@
[abs-pos-non-replaced-vlr-177.htm]
type: reftest
expected: FAIL

View file

@ -1,3 +0,0 @@
[abs-pos-non-replaced-vlr-193.htm]
type: reftest
expected: FAIL

View file

@ -1,3 +0,0 @@
[abs-pos-non-replaced-vrl-176.htm]
type: reftest
expected: FAIL

View file

@ -1,3 +0,0 @@
[abs-pos-non-replaced-vrl-192.htm]
type: reftest
expected: FAIL

View file

@ -1,3 +0,0 @@
[absolute-replaced-width-015.htm]
type: reftest
expected: FAIL