layout/reftests/css-blending/mix-blend-mode-nested-976533.html@4ab42b5ab56c
layout/reftests/css-blending/mix-blend-mode-nested-976533.html
Wed, 31 Dec 2014 07:53:36 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 07:53:36 +0100
- branch
- TOR_BUG_3246
- changeset 5
- 4ab42b5ab56c
- permissions
- -rw-r--r--
Correct small whitespace inconsistency, lost while renaming variables.
1 <!DOCTYPE HTML>
2 <head>
3 <style>
4 .parent {
5 width: 200px;
6 height: 200px;
7 position: absolute;
8 z-index: 1;
9 background-color: #00ff00;
10 }
12 .intermediate {
13 width: 100px;
14 height: 100px;
15 margin-left:50px;
16 background-color: #ff00ff;
17 mix-blend-mode: difference;
18 }
20 .child {
21 width: 100px;
22 height: 100px;
23 margin-left:50px;
24 background-color: #00ffff;
25 mix-blend-mode: multiply;
26 }
28 body {
29 margin:0px;
30 }
31 </style>
32 <!-- Blending should happen as follows:
33 First, the child element should blend with the intermediate element, with
34 the multiply operator. Is should not blend with the parent directly.
35 Then, group formed by the blended child and the intermediate element should
36 blend with the parent as a single layer.
37 -->
38 </head>
39 <body>
40 <div class="parent">
41 <div class="intermediate">
42 <div class="child"></div>
43 </div>
44 </div>
45 </body>
