layout/reftests/position-sticky/padding-1.html

   1 <!DOCTYPE html>
   2 <!-- Any copyright is dedicated to the Public Domain.
   3    - http://creativecommons.org/publicdomain/zero/1.0/ -->
   4 <html>
   5   <head>
   6     <title>CSS Test: Sticky Positioning - percentage offsets</title>
   7     <link rel="author" title="Corey Ford" href="mailto:cford@mozilla.com">
   8     <link rel="match" href="padding-1-ref.html">
   9     <meta name="assert" content="Percentage offsets should be resolved against the content box of the scrolling container">
  10     <style>
  11       body {
  12         /* Make sure it works on the first pass of reflow */
  13         overflow: scroll;
  14       }
  15       #scroll {
  16         width: 130px;
  17         height: 80px;
  18         overflow: scroll;
  19         border: 10px solid black;
  20         padding: 10px;
  21       }
  22       #sticky {
  23         position: sticky;
  24         top: 50%;
  25         left: 50%;
  26         width: 10px;
  27         height: 10px;
  28         background-color: black;
  29       }
  30     </style>
  31   <body>
  32     <div id="scroll">
  33       <div id="sticky">
  34       </div>
  35     </div>
  36   </body>
  37 </html>