518172-2b.html (809B)
1 <!DOCTYPE HTML> 2 <title>Testcase, bug 518172</title> 3 <style type="text/css"> 4 5 @font-face { 6 font-family: "MarkA"; 7 src: url(../fonts/markA.ttf); 8 } 9 10 html, body { margin: 0; padding: 0; } 11 body { font: 200px/200px MarkA; } 12 div#one { width: 200px; height:200px; padding: 100px; 13 transform: rotate(90deg); } 14 div#two { color: transparent; } 15 16 div.box { background: red; position: absolute; } 17 18 </style> 19 <!-- draw red boxes slightly larger (2px extra) than the area that should 20 be covered by the font --> 21 <div class="box" style="top: 122px; left: 122px; width: 36px; height: 256px;"></div> 22 <div class="box" style="top: 162px; left: 182px; width: 36px; height: 176px;"></div> 23 <div class="box" style="top: 202px; left: 242px; width: 36px; height: 96px;"></div> 24 25 <div id="one">A</div><div id="two">A</div>