OLD | NEW |
1 <style> | 1 <style> |
2 div { | 2 div { |
3 width: 200px; | 3 width: 200px; |
4 height: 200px; | 4 height: 200px; |
5 } | 5 } |
6 | 6 |
7 #div1_back { | 7 #div1_back { |
8 background-color: red; | 8 background-color: red; |
9 margin-left:40px; | 9 margin-left:40px; |
10 margin-top:40px; | 10 margin-top:40px; |
11 -webkit-transform: rotate(-30deg); | 11 transform: rotate(-30deg); |
12 overflow: hidden; | 12 overflow: hidden; |
13 } | 13 } |
14 | 14 |
15 #div2_back { | 15 #div2_back { |
16 background-color: green; | 16 background-color: green; |
17 -webkit-transform: rotate(30deg); | 17 transform: rotate(30deg); |
18 } | 18 } |
19 | 19 |
20 #div1 { | 20 #div1 { |
21 background-color: red; | 21 background-color: red; |
22 margin-left:40px; | 22 margin-left:40px; |
23 margin-top:40px; | 23 margin-top:40px; |
24 -webkit-transform: rotate(-30deg); | 24 transform: rotate(-30deg); |
25 -webkit-filter: hue-rotate(100deg); | 25 -webkit-filter: hue-rotate(100deg); |
26 } | 26 } |
27 | 27 |
28 #div2 { | 28 #div2 { |
29 background-color: green; | 29 background-color: green; |
30 -webkit-transform: rotate(30deg); | 30 transform: rotate(30deg); |
31 } | 31 } |
32 </style> | 32 </style> |
33 | 33 |
34 <div style="position:absolute"> | 34 <div style="position:absolute"> |
35 <div id="div1_back"> | 35 <div id="div1_back"> |
36 <!-- This blocks should be overlaid by the second set of blocks. --> | 36 <!-- This blocks should be overlaid by the second set of blocks. --> |
37 <div id="div2_back"> | 37 <div id="div2_back"> |
38 </div> | 38 </div> |
39 </div> | 39 </div> |
40 </div> | 40 </div> |
41 | 41 |
42 <div style="position:absolute"> | 42 <div style="position:absolute"> |
43 <div id="div1"> | 43 <div id="div1"> |
44 <!-- This paragraph will have a filter applied. --> | 44 <!-- This paragraph will have a filter applied. --> |
45 <div id="div2"> | 45 <div id="div2"> |
46 </div> | 46 </div> |
47 </div> | 47 </div> |
48 </div> | 48 </div> |
49 | 49 |
50 <script> | 50 <script> |
51 if (window.testRunner) | 51 if (window.testRunner) |
52 window.testRunner.dumpAsTextWithPixelResults(); | 52 window.testRunner.dumpAsTextWithPixelResults(); |
53 </script> | 53 </script> |
OLD | NEW |