column-contain-2-ref.html (1002B)
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 <link rel="author" title="Corey Ford" href="mailto:corey@coreyford.name"> 7 <style> 8 #scroll { 9 overflow: hidden; 10 height: 200px; 11 line-height: 1; 12 } 13 #columns { 14 column-count: 2; 15 column-rule: 1px solid black; 16 height: 200px; 17 width: 200px; 18 } 19 #contain { 20 padding-bottom: 10px; 21 border-bottom: 10px solid gray; 22 } 23 #fill { 24 height: 370px; 25 background: blue; 26 } 27 #sticky { 28 position: relative; 29 top: 190px; 30 width: 10px; 31 height: 10px; 32 background: black; 33 } 34 </style> 35 </head> 36 <body> 37 <div id="scroll"> 38 <div id="columns"> 39 <div id="contain"> 40 <div id="sticky"></div> 41 <div id="fill"></div> 42 </div> 43 </div> 44 </div> 45 </body> 46 </html>