1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/reftests/css-blending/mix-blend-mode-child-of-blended-has-opacity.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,45 @@
1.4 +<!DOCTYPE html>
1.5 +<html>
1.6 + <head>
1.7 + <title>CSS Test: blending between an element and the child with opacity</title>
1.8 + <link rel="author" title="Mirela Budăeș" href="mailto:mbudaes@adobe.com">
1.9 + <link rel="help" href="http://dev.w3.org/fxtf/compositing-1/#mix-blend-mode">
1.10 + <meta name="flags" content="">
1.11 + <meta name="assert" content="Test checks that an element with mix-blend-mode and his child with opacity blends as a group(no blending between the element with mix-blend-mode and the child element)">
1.12 + <link rel="match" href="reference/mix-blend-mode-child-of-blended-has-opacity-ref.html">
1.13 + <style>
1.14 + .parent {
1.15 + opacity: 0.9;
1.16 + background: yellow;/*rgb(255,255,0);*/
1.17 + margin: 30px;
1.18 + width: 120px;
1.19 + height: 120px;
1.20 + display: inline-block;
1.21 + }
1.22 + .blended {
1.23 + width: 100px;
1.24 + height: 100px;
1.25 + background: fuchsia; /* rgb(255, 0, 255);*/
1.26 + display: inline-block;
1.27 + mix-blend-mode: difference;
1.28 + margin-top: 10px;
1.29 + margin-left: 10px;
1.30 + }
1.31 + .childBlended {
1.32 + background: red;/*rgb(255,0,0);*/
1.33 + width: 80px;
1.34 + height: 80px;
1.35 + margin-top: 10px;
1.36 + margin-left: 10px;
1.37 + opacity: 0.99;
1.38 + }
1.39 + </style>
1.40 + </head>
1.41 + <body>
1.42 + <div class="parent">
1.43 + <div class="blended">
1.44 + <div class="childBlended"></div>
1.45 + </div>
1.46 + </div>
1.47 + </body>
1.48 +</html>
