mask-clip-7-ref.html (844B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta content="ahem" name="flags"> 6 <link rel="stylesheet" href="/fonts/ahem.css" /> 7 <style> 8 div.mask { 9 background-color: purple; 10 width: 40px; 11 height: 20px; 12 border-radius: 5px; 13 position: relative; 14 } 15 span.mask { 16 font: 20px/1 Ahem; 17 line-height: 20px; 18 color: purple; 19 border-radius: 5px; 20 position: relative; 21 } 22 .unclipped-child { 23 position: absolute; 24 top: -6px; 25 left: -6px; 26 width: 52px; 27 height: 32px; 28 background: purple; 29 } 30 </style> 31 </head> 32 <body> 33 <div class="mask"><div class="unclipped-child"></div></div> 34 <br> 35 <span class="mask">XX<span class="unclipped-child"></span></span> 36 </body> 37 </html>