image-object-position-with-background-2.html (1037B)
1 <!DOCTYPE html> 2 <!-- 3 Any copyright is dedicated to the Public Domain. 4 http://creativecommons.org/publicdomain/zero/1.0/ 5 --> 6 <!-- 7 This testcase ensures that we paint the background around an opaque image, 8 when the image is offset from the container via 'object-position' (and 9 the img element is fragmented). This is an interesting case because, by 10 default, images fill their container, which means we can often optimize 11 away the background completely. BUT, if "object-position" offsets the 12 image from its container's content-box, we can't optimize away the 13 background; it need to be painted in the uncovered area. 14 --> 15 <html class="reftest-paged"> 16 <head> 17 <meta charset="utf-8"> 18 <style type="text/css"> 19 img.test { 20 background: salmon; 21 object-position: 10px 20px; 22 width: 32px; 23 height: 5in; 24 display: block; /* Required for fragmentation */ 25 } 26 </style> 27 </head> 28 <body> 29 <img class="test" src="blue-32x32.png"> 30 </body> 31 </html>