mirror of
https://github.com/servo/servo.git
synced 2025-08-06 14:10:11 +01:00
layout: Paint stacking contexts' overflow areas properly.
This was making `box-shadow` not show up in many cases, in particular, but the effects were not limited to that.
This commit is contained in:
parent
ba8cf6b0e6
commit
5ea2c6dcfd
30 changed files with 357 additions and 179 deletions
|
@ -222,3 +222,5 @@ fragment=top != ../html/acid2.html acid2_ref.html
|
|||
!= inset_blackborder.html blackborder_ref.html
|
||||
!= outset_blackborder.html blackborder_ref.html
|
||||
== border_radius_clip_a.html border_radius_clip_ref.html
|
||||
== stacking_context_overflow_a.html stacking_context_overflow_ref.html
|
||||
== stacking_context_overflow_relative_outline_a.html stacking_context_overflow_relative_outline_ref.html
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<html>
|
||||
<body>
|
||||
<div style="position: absolute; top: 0px; left: 0px;">
|
||||
<div style="position: absolute; background: green; margin-left: 512px; width: 20px; height: 20px;"></div>
|
||||
<div style="position: absolute; background: green; top: 0; margin-left: 512px; width: 20px; height: 20px;"></div>
|
||||
|
||||
<!-- This position:fixed sibling should force its sibling to be layerized. -->
|
||||
<div style="position: fixed;"></div>
|
||||
|
|
22
tests/ref/stacking_context_overflow_a.html
Normal file
22
tests/ref/stacking_context_overflow_a.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<html>
|
||||
<head>
|
||||
<!-- Tests that stacking contexts display overflow. -->
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
section {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: solid black 2px;
|
||||
font: 24px Arial;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section>CSS IS AWESOME</section>
|
||||
</body>
|
||||
</html>
|
||||
|
21
tests/ref/stacking_context_overflow_ref.html
Normal file
21
tests/ref/stacking_context_overflow_ref.html
Normal file
|
@ -0,0 +1,21 @@
|
|||
<html>
|
||||
<head>
|
||||
<!-- Tests that stacking contexts display overflow. -->
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
section {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border: solid black 2px;
|
||||
font: 24px Arial;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<section>CSS IS AWESOME</section>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
25
tests/ref/stacking_context_overflow_relative_outline_a.html
Normal file
25
tests/ref/stacking_context_overflow_relative_outline_a.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<style>
|
||||
section {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
left: 100px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
h1 {
|
||||
position: relative;
|
||||
top: -50px;
|
||||
left: -50px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
margin: 0;
|
||||
outline: solid 10px green;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<section><h1></h1></section>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<style>
|
||||
section {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 40px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
border: solid 10px green;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<section></section>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
Loading…
Add table
Add a link
Reference in a new issue