Merge Chromium + Blink git repositories
[chromium-blink-merge.git] / third_party / WebKit / LayoutTests / fast / repaint / reflection-redraw.html
blob8ade6507f0c50ad76ecdd16571f8496c7fa3914f
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
2 "http://www.w3.org/TR/html4/strict.dtd">
3 <html>
4 <head>
5 <meta http-equiv="Content-type" content="text/html; charset=utf-8">
6 <title>Reflection Redraw</title>
7 <style type="text/css" media="screen">
8 #container {
9 position: absolute;
10 top: 120px;
12 .box {
13 position: absolute;
14 width: 150px;
15 height: 100px;
16 margin: 10px;
17 padding: 10px;
18 -webkit-box-sizing: border-box;
19 text-align: center;
20 border: 1px solid black;
21 background-color: gray;
23 .reflect {
24 background-color: gray;
25 -webkit-box-reflect: left 5px;
28 </style>
29 <script src="resources/text-based-repaint.js" type="text/javascript" charset="utf-8"></script>
30 <script type="text/javascript" charset="utf-8">
31 function repaintTest()
33 var paras = document.getElementsByTagName('p');
34 for (var i = 0; i < paras.length; ++i)
35 paras[i].style.color = 'green';
37 </script>
38 </head>
39 <body onload="runRepaintTest()">
40 <div id="container">
41 <div class="box reflect-top" style="left: 275px; -webkit-box-reflect: above 10px;">
42 <p>The color of this text in the reflection should be green</p>
43 </div>
45 <div class="box reflect-left" style="top: 110px; left: 200px; -webkit-box-reflect: left 10px;">
46 <p>The color of this text in the reflection should be green</p>
47 </div>
49 <div class="box reflect-right" style="top: 110px; left: 350px; -webkit-box-reflect: right 10px;">
50 <p>The color of this text in the reflection should be green</p>
51 </div>
53 <div class="box reflect-bottom" style="top: 220px; left: 275px; -webkit-box-reflect: below 10px;">
54 <p>The color of this text in the reflection should be green</p>
55 </div>
56 </div>
58 </html>