1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000 1.2 +++ b/layout/reftests/image-rect/background-with-other-properties.html Wed Dec 31 06:09:35 2014 +0100 1.3 @@ -0,0 +1,56 @@ 1.4 +<!DOCTYPE html> 1.5 +<!-- 1.6 + Any copyright is dedicated to the Public Domain. 1.7 + http://creativecommons.org/licenses/publicdomain/ 1.8 + 1.9 + Tests if -moz-image-rect() works collaboratively with other background 1.10 + properties as expected. 1.11 +--> 1.12 +<html> 1.13 + <head> 1.14 + <title>Testcases: -moz-image-rect() [bug 113577]</title> 1.15 + <style> 1.16 + div.wrapper { 1.17 + width: 32px; 1.18 + height: 32px; 1.19 + margin: 10px; 1.20 + background-color: red; 1.21 + } 1.22 + div.wrapper div { 1.23 + width: 32px; 1.24 + height: 32px; 1.25 + } 1.26 + /* tests with background-repeat */ 1.27 + #test1 { 1.28 + background: repeat -moz-image-rect(url(green-16x16-in-blue-32x32.png), 8, 24, 24, 8); 1.29 + } 1.30 + /* tests with background-position */ 1.31 + #test2 { 1.32 + background: no-repeat -8px -8px -moz-image-rect(url(green-16x16-in-blue-32x32.png), 0, 24, 24, 0); 1.33 + } 1.34 + /* tests with background layers */ 1.35 + #test3 { 1.36 + background: no-repeat 0px 0px -moz-image-rect(url(green-16x16-in-blue-32x32.png), 0, 16, 16, 0), 1.37 + no-repeat 16px 0px -moz-image-rect(url(green-16x16-in-blue-32x32.png), 0, 32, 16, 16); 1.38 + } 1.39 + /* for comparison with test5 */ 1.40 + #test4 { 1.41 + background-image: -moz-image-rect(url(green-16x16-in-blue-32x32.png), 8, 24, 24, 8); 1.42 + background-repeat: no-repeat; 1.43 + } 1.44 + /* tests with background-size */ 1.45 + #test5 { 1.46 + background-size: 100% 100%; 1.47 + background-image: -moz-image-rect(url(green-16x16-in-blue-32x32.png), 8, 24, 24, 8); 1.48 + background-repeat: no-repeat; 1.49 + } 1.50 + </style> 1.51 + </head> 1.52 + <body> 1.53 + <div class="wrapper"><div id="test1"></div></div> 1.54 + <div class="wrapper"><div id="test2"></div></div> 1.55 + <div class="wrapper"><div id="test3"></div></div> 1.56 + <div class="wrapper"><div id="test4"></div></div> 1.57 + <div class="wrapper"><div id="test5"></div></div> 1.58 + </body> 1.59 +</html>