third_party/WebKit/LayoutTests/compositing/overflow/fixed-position-ancestor-clip.html

   1 <!DOCTYPE>
   2
   3 <html>
   4 <head>
   5   <title>Position fixed with transform</title>
   6   <style type="text/css" media="screen">
   7     ::-webkit-scrollbar {
   8       width: 0px;
   9       height: 0px;
  10     }
  11     body {
  12       height: 1000px;
  13       width: 1000px;
  14     }
  15     #fixed {
  16       position: fixed;
  17       width: 100px;
  18       height: 100px;
  19       background-color: red;
  20       overflow: hidden;
  21     }
  22
  23     .box {
  24       width: 100px;
  25       height: 100px;
  26       background-color: green;
  27       transform: translateZ(0);
  28     }
  29
  30     p {
  31       position: absolute;
  32       left: 50px;
  33       top: 150px;
  34     }
  35   </style>
  36   <script type="text/javascript" charset="utf-8">
  37     window.addEventListener('load', function() {
  38       window.scrollBy(50, 50);
  39     }, false);
  40   </script>
  41   <script src="../resources/mock_scrollbars.js"></script>
  42 </head>
  43 <body>
  44
  45   <p>You should see a single green square, with no red.</p>
  46   <div id="fixed">
  47     <div class="box">
  48     </div>
  49   </div>
  50
  51 </body>
  52 </html>