<!DOCTYPE html>
<!--
 | This test checks that an element is positioned relative to the viewport
 | despite the presence of an absolute containing block in the element's
 | ancestor chain.
 -->
<html>
<head>
  <style>
    .static-container {
      width: 50px;
      height: 50px;
      margin-top: 10px;
      margin-left: 10px;
      background-color: rgb(100, 255, 100);
    }
    .transformed-container {
      transform: translateX(50px) translateY(50px) rotate(45deg);
      width: 200px;
      height: 200px;
      background-color: rgb(255, 100, 100);
    }
    .fixed-element {
      position: fixed;
      width: 50px;
      height: 50px;
      top: 25px;
      left: 25px;
      background-color: rgb(100, 100, 255);
    }
  </style>
</head>

<body>
  <div class="static-container"></div>
  <div class="static-container">
    <div class="transformed-container">
        <div class="fixed-element">
      </div>
    </div>
  </div>
</body>
</html>