padding-3.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, bottom/right</title> 7 <link rel="author" title="Corey Ford" href="mailto:cford@mozilla.com"> 8 <link rel="match" href="padding-3-ref.html"> 9 <meta name="assert" content="Bottom/right offsets should position the element with respect to the content box of the scrolling container"> 10 <style> 11 body { 12 font-size: 0px; 13 } 14 #scroll { 15 width: 80px; 16 height: 80px; 17 overflow: scroll; 18 border: 10px solid black; 19 padding: 10px; 20 white-space: nowrap; 21 } 22 #sticky { 23 position: sticky; 24 bottom: 20px; 25 right: 20px; 26 display: inline-block; 27 width: 10px; 28 height: 10px; 29 background-color: black; 30 } 31 </style> 32 <body> 33 <div id="scroll"> 34 <div style="height: 90px; width: 100px"></div> 35 <div style="display: inline-block; width: 90px; height: 10px"></div 36 ><div id="sticky"></div> 37 </div> 38 </body> 39 </html>