Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-07-22 23:03:42 +01:00
Code Issues Projects Releases Packages Wiki Activity

Fixes positioning of inline blocks that generate stacking contexts.

Browse source
This commit is contained in:
Glenn Watson 2015-03-18 11:08:53 +10:00
parent a521755607
commit d61d3ad4ba
4 changed files with 44 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

2
components/layout/inline.rs
View file

@ -1342,7 +1342,7 @@ impl Flow for InlineFlow {
self.base
.absolute_position_info
.relative_containing_block_mode,
CoordinateSystem::Own);
CoordinateSystem::Parent);
let clip = fragment.clipping_region_for_children(&self.base.clip,
&stacking_relative_border_box);
match fragment.specific {

1
tests/ref/basic.list
View file

@ -133,6 +133,7 @@ flaky_cpu == append_style_a.html append_style_b.html
== inline_block_parent_width.html inline_block_parent_width_ref.html
== inline_block_parent_width_percentage.html inline_block_parent_width_ref.html
== inline_block_percentage_height_a.html inline_block_percentage_height_ref.html
== inline_block_stacking_context_a.html inline_block_stacking_context_ref.html
== inline_block_with_margin_a.html inline_block_with_margin_ref.html
# inline_border_a.html inline_border_b.html
== inline_element_border_a.html inline_element_border_ref.html

21
tests/ref/inline_block_stacking_context_a.html Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.fa {
display: inline-block;
transform: translate(0, 0);
opacity: 0.5;
}
</style>
</head>
<body>
<div style="padding: 100px 0 0 0;">
<div class="fa">A</div>
</div>
</body>
</html>

21
tests/ref/inline_block_stacking_context_ref.html Normal file
View file

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.fa {
display: block;
transform: translate(0, 0);
opacity: 0.5;
}
</style>
</head>
<body>
<div style="padding: 100px 0 0 0;">
<div class="fa">A</div>
</div>
</body>
</html>