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

fix block size for absolute replaced element

Browse source 
Absolutely replaced elements with padding were incorrectly setting their
block size to include twice the padding values.  This attempts to stop
that extra padding for replaced elements but leave the working flow for
non replaced elements
This commit is contained in:
Bob 2017-11-11 19:21:51 +00:00
parent 3ecd0174cc
commit 21e2ed522b
6 changed files with 112 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

7
components/layout/block.rs
View file

@ -1300,7 +1300,12 @@ impl BlockFlow {
self.base.position.start.b = solution.block_start + self.fragment.margin.block_start
}
let block_size = solution.block_size + self.fragment.border_padding.block_start_end();
let block_size = if self.fragment.is_replaced() {
solution.block_size
} else {
(solution.block_size + self.fragment.border_padding.block_start_end())
};
self.fragment.border_box.size.block = block_size;
self.base.position.size.block = block_size;

41
tests/wpt/mozilla/meta/MANIFEST.json
View file

@ -73,6 +73,18 @@
{}
]
],
"css/absolute_div_with_padding.html": [
[
"/_mozilla/css/absolute_div_with_padding.html",
[
[
"/_mozilla/css/absolute_div_with_padding_ref.html",
"=="
]
],
{}
]
],
"css/absolute_hypothetical_float.html": [
[
"/_mozilla/css/absolute_hypothetical_float.html",
@ -109,6 +121,18 @@
{}
]
],
"css/absolute_img_with_padding.html": [
[
"/_mozilla/css/absolute_img_with_padding.html",
[
[
"/_mozilla/css/absolute_img_with_padding_ref.html",
"=="
]
],
{}
]
],
"css/absolute_inline_containing_block_a.html": [
[
"/_mozilla/css/absolute_inline_containing_block_a.html",
@ -7906,6 +7930,11 @@
{}
]
],
"css/absolute_img_with_padding_ref.html": [
[
{}
]
],
"css/absolute_inline_containing_block_ref.html": [
[
{}
@ -60876,6 +60905,10 @@
"e38f77f3a7691b11abeece839aba62ce9246ff6a",
"support"
],
"css/absolute_div_with_padding.html": [
"6bfd1ae130e22c3083070a3574f827ded86f6724",
"reftest"
],
"css/absolute_hypothetical_float.html": [
"1abe08648b55df2390cb2b6561923aa576212fbf",
"reftest"
@ -60900,6 +60933,14 @@
"400117a1d118ee05db150877aa81bb414f4e7200",
"support"
],
"css/absolute_img_with_padding.html": [
"15896a5c1c77109c26624248d3df213788eb186c",
"reftest"
],
"css/absolute_img_with_padding_ref.html": [
"3f949e99ab09c5f8ce352a7987330d99023d7f0d",
"support"
],
"css/absolute_inline_containing_block_a.html": [
"8174a236497815db250a3b11aeb322e0e9c7c74f",
"reftest"

24
tests/wpt/mozilla/tests/css/absolute_div_with_padding.html Normal file
View file

@ -0,0 +1,24 @@
<!doctype html>
<meta charset="utf-8">
<title></title>
<link rel="match" href="absolute_div_with_padding_ref.html">
<style>
.absolute{
position: absolute;
top: 0px;
left: 0px;
padding: 100px;
width: 150px;
height: 150px;
background-color: green;
}
.box{
width: 350px;
height: 350px;
position: relative;
background: red;
}
</style>
<div class="box">
<div class="absolute"></div>
</div>

20
tests/wpt/mozilla/tests/css/absolute_div_with_padding_ref.html Normal file
View file

@ -0,0 +1,20 @@
<!doctype html>
<meta charset="utf-8">
<title></title>
<style>
.absolute{
padding: 100px;
width: 150px;
height: 150px;
background-color: green;
}
.box{
width: 350px;
height: 350px;
position: relative;
background: red;
}
</style>
<div class="box">
<div class="absolute"></div>
</div>

15
tests/wpt/mozilla/tests/css/absolute_img_with_padding.html Normal file
View file

@ -0,0 +1,15 @@
<!doctype html>
<meta charset="utf-8">
<title>CSS Test: Absolute position image with padding should not increase in size</title>
<link rel="match" href="absolute_img_with_padding_ref.html">
<body>
<style>
img{
position: absolute;
top: 0px;
left: 0px;
padding: 100px;
}
</style>
<img src="100x100_green.png" alt="img">
</body>

6
tests/wpt/mozilla/tests/css/absolute_img_with_padding_ref.html Normal file
View file

@ -0,0 +1,6 @@
<!doctype html>
<meta charset="utf-8">
<title>CSS Test: Absolute position image with padding should not increase in size</title>
<body style="margin:0">
<img style="padding: 100px;" src="100x100_green.png" alt="img">
</body>