<!DOCTYPE HTML>
<html>
<head>
<style>
  .content {
    isolation: isolate;
  }
  .content > div {
    float: left;
    margin: 10px;
    width: 100px;
    height: 100px;
    background-color: green;
    overflow: hidden;
  }
  .content > div > div {
    mix-blend-mode: multiply;
    width: 300px;
    height: 300px;
    background-color: red;
    transform: rotateX(0deg);
  }
</style>
</head>
<body>
  <p>Test that mix-blend-mode multiply works for layers that are clipped with overflow hidden.</p>
  <p>This test passes if you can see two black squares.</p>
  <div class="content">
    <div>
      <div></div>
    </div>
    <div style="transform: rotateX(0deg);">
      <div></div>
    </div>
  </div>
</body>
</html>