OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <meta charset="utf-8"/> |
| 3 <title>Open Font Format: USE_TYPO_METRICS</title> |
| 4 <link rel="help" href="http://www.mathml-association.org/MathMLinHTML5/S2.html#S
S2.SSS1"/> |
| 5 <link rel="match" href="use-typo-metrics-1-ref.html"/> |
| 6 <meta name="assert" content="Verify that the USE_TYPO_METRICS flag from the OS/2
table is taken into account to calculate line height."> |
| 7 <style> |
| 8 @font-face { |
| 9 font-family: TestFont; |
| 10 src: url("/fonts/math/lineheight5000-typolineheight2300.woff"); |
| 11 } |
| 12 .green { |
| 13 position: absolute; |
| 14 background: green; |
| 15 width: 115px; |
| 16 } |
| 17 .red { |
| 18 position: absolute; |
| 19 background: red; |
| 20 width: 115px; |
| 21 } |
| 22 .forceHeight { |
| 23 height: 230px; |
| 24 } |
| 25 .leftSide { |
| 26 left: 10px; |
| 27 } |
| 28 .rightSide { |
| 29 left: 125px; |
| 30 } |
| 31 span { |
| 32 /* em=1000, lineHeight=5000, typoLineHeight=2300 and font-size=100px |
| 33 implies typoLineHeightPx = 230px < 500px = lineHeightPx */ |
| 34 font-family: TestFont; |
| 35 font-size: 100px; |
| 36 color: transparent; |
| 37 } |
| 38 </style> |
| 39 <body> |
| 40 <p>Test passes if there is a green square and no red.</p> |
| 41 |
| 42 <div> |
| 43 <!-- Left side verifies that typoLineHeightPx <= 230px --> |
| 44 <div class="leftSide red"><span>O</span></div> |
| 45 <div class="leftSide green forceHeight"></div> |
| 46 |
| 47 <!-- Right side verifies that typoLineHeightPx => 230px --> |
| 48 <div class="rightSide red forceHeight"></div> |
| 49 <div class="rightSide green"><span>O</span></div> |
| 50 </div> |
| 51 </body> |
OLD | NEW |