layout/reftests/css-blending/mix-blend-mode-nested-976533-ref.html

   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                 }
  11
  12                 .intermediate {
  13                         width: 100px;
  14                   height: 100px;
  15                   margin-left:50px;
  16                   background-color: #ffffff;
  17                 }
  18
  19                 .child {
  20                   width: 100px;
  21                   height: 100px;
  22                   margin-left:50px;
  23                   background-color: #00ffff;
  24                 }
  25
  26                 .grandchild {
  27                         width: 50px;
  28                         height: 100px;
  29                         margin-left: 50px;
  30                         background-color: #0000ff;
  31                 }
  32
  33                 body {
  34                         margin:0px;
  35                 }
  36
  37         </style>
  38 </head>
  39 <body>
  40         <div class="parent">
  41                 <div class="intermediate">
  42             <div class="child">
  43                 <div class="grandchild"></div>
  44             </div>
  45     </div>
  46         </div>
  47 </body>