padding-2.html (1161B)
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 - offsets reference</title> 7 <link rel="author" title="Corey Ford" href="mailto:cford@mozilla.com"> 8 <link rel="match" href="padding-2-ref.html"> 9 <meta name="flags" content="dom"> 10 <meta name="assert" content="Offsets should position the element with respect to the content box of the scrolling container"> 11 <style> 12 #scroll { 13 width: 80px; 14 height: 80px; 15 overflow: hidden; 16 border: 10px solid black; 17 padding: 10px; 18 } 19 #sticky { 20 position: sticky; 21 width: 10px; 22 height: 10px; 23 top: 20px; 24 background-color: black; 25 } 26 .fill { 27 width: 1000px; 28 height: 1000px; 29 } 30 </style> 31 <body> 32 <div id="scroll"> 33 <div class="fill"></div> 34 <div id="sticky"></div> 35 <div class="fill"></div> 36 </div> 37 <script type="application/javascript"> 38 document.getElementById('scroll').scrollTop = 1100; 39 </script> 40 </body> 41 </html>