709477-1-ref.html (1155B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>glyph clipping (reference)</title> 5 <style> 6 #clip { position: absolute; 7 overflow: hidden; 8 font-size: 16px; 9 width: 500px; 10 height: 300px;} 11 /* Offsets keep the text far enough away from clip boundaries so that 12 cairo knows the text is within the clip. Non-unit alpha color makes 13 the bug show even without antialiasing. */ 14 #text { position: absolute; 15 left: 100px; 16 top: 100px; 17 color: rgba(0,0,0,0.4)} 18 #cover { position: absolute; 19 top: 90px; 20 left: 120px; 21 height: 50px; 22 width: 60px; 23 background: transparent; } 24 #mod { position: absolute; 25 top: 400px; 26 left: 0px; 27 height: 2000px; 28 width: 600px; 29 background: transparent; } 30 </style> 31 </head> 32 <body> 33 <div id="clip"> 34 <div id="text"> 35 Some text that was</br> 36 initially partially covered.</br> 37 </div> 38 </div> 39 <div id="cover"> 40 </div> 41 <div id="mod"> 42 </div> 43 </body> 44 <script> 45 scrollTo(0,1); 46 </script> 47 </html>