| OLD | NEW |
| 1 <!DOCTYPE HTML> | 1 <!DOCTYPE HTML> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <style> | 4 <style> |
| 5 div { | 5 div { |
| 6 width: 200px; | 6 width: 200px; |
| 7 height: 200px; | 7 height: 200px; |
| 8 -webkit-transform: rotateY(30deg) rotateX(-30deg); | 8 transform: rotateY(30deg) rotateX(-30deg); |
| 9 background: url("resources/white_square.svg") no-repeat, rgba(55, 55, 99
, 1); | 9 background: url("resources/white_square.svg") no-repeat, rgba(55, 55, 99
, 1); |
| 10 background-blend-mode: difference; | 10 background-blend-mode: difference; |
| 11 } | 11 } |
| 12 | 12 |
| 13 body { | 13 body { |
| 14 background: green; | 14 background: green; |
| 15 } | 15 } |
| 16 | 16 |
| 17 </style> | 17 </style> |
| 18 <!-- Test to validate that background blending is working properly for hardware
accelerated elements. | 18 <!-- Test to validate that background blending is working properly for hardware
accelerated elements. |
| 19 This also validates that background layers don't blend with any of the conte
nt below the accelerated element. --> | 19 This also validates that background layers don't blend with any of the conte
nt below the accelerated element. --> |
| 20 </head> | 20 </head> |
| 21 <body> | 21 <body> |
| 22 <div></div> | 22 <div></div> |
| 23 </body> | 23 </body> |
| OLD | NEW |