Use background color for GraphicsLayers when applicable
[WebKit-https.git] / LayoutTests / compositing / overflow / overflow-compositing-descendant.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4   <style type="text/css" media="screen">
5
6     .movie {
7         position: absolute;
8         overflow: hidden;
9         height: 200px;
10         width: 110px;
11         padding: 10px;
12         background-color: white;
13         border: 1px solid black;
14     }
15     
16     video {
17         background-color: black;
18     }
19     
20     .box {
21       width: 100px;
22       height: 100px;
23     }
24     
25     .test {
26         position: relative;
27         margin-top: -100px;
28         background-color: green;
29     }
30     
31     .indicator {
32         background-color: red;
33     }
34   </style>
35   <script type="text/javascript" charset="utf-8">
36     if (window.testRunner)
37       testRunner.waitUntilDone();
38   </script>
39 </head>
40 <body>
41     
42     <p>You should see a green box under the video. If you see red, the test failed.</p>
43     <div class="movie content">
44         <video height="100" width="100"></video>
45         <div class="indicator box"></div>
46         <div class="test box"></div>
47     </div>
48
49     <script type="text/javascript" charset="utf-8">
50       var video = document.getElementsByTagName('video')[0];
51       video.src = '../resources/video.' + (video.canPlayType('video/ogg') ? 'ogv' : 'mp4');
52       video.addEventListener('canplaythrough', function() {
53         if (window.testRunner)
54           testRunner.notifyDone();
55       }, false);
56     </script>
57     
58 </body>
59 </html>