src/third_party/WebKit/LayoutTests/fast/css/sticky/sticky-both-sides-expected.html

   1 <!DOCTYPE html>
   2
   3 <html>
   4 <head>
   5 <style>
   6     body {
   7         margin: 0;
   8         overflow: hidden; /* hide scrollbars */
   9     }
  10
  11     .container {
  12         position: absolute;
  13         width: 2000px;
  14         height: 180px;
  15         top: 50px;
  16         outline: 2px solid black;
  17     }
  18
  19     .vertical.container {
  20         top: 0px;
  21         left: 50px;
  22         width: 180px;
  23         height: 2000px;
  24     }
  25
  26     .box {
  27         width: 800px;
  28         height: 180px;
  29     }
  30
  31     .vertical .box {
  32         width: 180px;
  33         height: 500px;
  34     }
  35
  36     .sticky {
  37         position: relative;
  38         left: 50px;
  39         right: 50px;
  40         background-color: green;
  41     }
  42
  43     .vertical .sticky {
  44         left: 0;
  45         top: 50px;
  46         bottom: 50px;
  47         background-color: blue;
  48         opacity: 0.75;
  49     }
  50 </style>
  51 </head>
  52 <body>
  53     <div class="container">
  54         <div class="sticky box"></div>
  55     </div>
  56     <div class="vertical container">
  57         <div class="sticky box"></div>
  58     </div>
  59
  60 </body>
  61 </html>