Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-17 19:35:33 +01:00
Code Issues Projects Releases Packages Wiki Activity

Implement background-position keyword values

Browse source 
Also fixes calculation of background-position percentages:

Rather than multiplying the container size by a percent and aligning the top
left of the image at the resulting width, we also need to subtract a
corresponding percent of the image size, per
http://dev.w3.org/csswg/css2/colors.html#propdef-background-position

"A value pair of '100% 100%' places the lower right corner of the image in the
lower right corner of the padding box. With a value pair of '14% 84%', the
point 14% across and 84% down the image is to be placed at the point 14%
across and 84% down the padding box."
This commit is contained in:
Matt Brubeck 2014-09-11 17:12:25 -07:00
parent 66a7de750c
commit 6c9524b687
9 changed files with 258 additions and 50 deletions
Download patch file Download diff file Expand all files Collapse all files

31
tests/ref/background_position_shorthand_ref.html Normal file
View file

@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<title>background shorthand test</title>
<style>
.outer {
float: left;
background-color: red;
width: 200px;
height: 200px;
}
.inner {
background-image: url(100x100_green.png);
width: 100px;
height: 100px;
position: relative;
top: 50px;
left: 100px;
}
</style>
</head>
<body>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
<div class="outer"><div class="inner"></div></div>
</body>
</html>