LayoutTests/fonts/use-typo-metrics-1.html - WebKit - Git at Google

 <!DOCTYPE html>
 <meta charset="utf-8"/>
 <title>Open Font Format: USE_TYPO_METRICS</title>
 <link rel="help" href="http://www.mathml-association.org/MathMLinHTML5/S2.html#SS2.SSS1"/>
 <link rel="match" href="use-typo-metrics-1-ref.html"/>
 <style>
   @font-face {
     font-family: TestFont;
     src: url("lineheight5000-typolineheight2300.woff");
   }
   .green {
      position: absolute;
      background: green;
      width: 115px;
   }
   .red {
      position: absolute;
      background: red;
      width: 115px;
   }
   .forceHeight {
     height: 230px;
   }
   .leftSide {
     left: 10px;
   }
   .rightSide {
     left: 125px;
   }
   span {
     /* em=1000, lineHeight=5000, typoLineHeight=2300 and font-size=100px
        implies typoLineHeightPx = 230px < 500px = lineHeightPx */
      font-family: TestFont;
      font-size: 100px;
      color: transparent;
   }
 </style>
 <body>
   <p>Test passes if there is a green square and no red.</p>

   <div>
     <!-- Left side verifies that typoLineHeightPx <= 230px -->
     <div class="leftSide red"><span>O</span></div>
     <div class="leftSide green forceHeight"></div>

     <!-- Right side verifies that typoLineHeightPx => 230px -->
     <div class="rightSide red forceHeight"></div>
     <div class="rightSide green"><span>O</span></div>
   </div>
 </body>
	<!DOCTYPE html>
	<meta charset="utf-8"/>
	<title>Open Font Format: USE_TYPO_METRICS</title>
	<link rel="help" href="http://www.mathml-association.org/MathMLinHTML5/S2.html#SS2.SSS1"/>
	<link rel="match" href="use-typo-metrics-1-ref.html"/>
	<style>
	@font-face {
	font-family: TestFont;
	src: url("lineheight5000-typolineheight2300.woff");
	}
	.green {
	position: absolute;
	background: green;
	width: 115px;
	}
	.red {
	position: absolute;
	background: red;
	width: 115px;
	}
	.forceHeight {
	height: 230px;
	}
	.leftSide {
	left: 10px;
	}
	.rightSide {
	left: 125px;
	}
	span {
	/* em=1000, lineHeight=5000, typoLineHeight=2300 and font-size=100px
	implies typoLineHeightPx = 230px < 500px = lineHeightPx */
	font-family: TestFont;
	font-size: 100px;
	color: transparent;
	}
	</style>
	<body>
	<p>Test passes if there is a green square and no red.</p>

	<div>
	<!-- Left side verifies that typoLineHeightPx <= 230px -->
	<div class="leftSide red"><span>O</span></div>
	<div class="leftSide green forceHeight"></div>

	<!-- Right side verifies that typoLineHeightPx => 230px -->
	<div class="rightSide red forceHeight"></div>
	<div class="rightSide green"><span>O</span></div>
	</div>
	</body>