4 font-family: AhemNoXHeight;
5 src: url(
"../../resources/AhemNoXHeight.ttf");
7 .em { height:
.5em; width:
.5em; }
8 .ex { height:
1ex; width:
1ex; }
9 .cover { background: green; }
10 .back { background: red; }
13 #test
> div { font-family: AhemNoXHeight; font-size:
100px; position: absolute; top:
10px; }
14 #description { margin-top:
70px; }
18 <div class='back em one'
></div>
19 <div class='cover ex one' id='ex'
></div>
21 <div class='back ex two'
></div>
22 <div class='cover em two'
></div>
24 <script src=
"../../resources/js-test.js"></script>
26 // Need to wait for fonts to load.
27 window
.jsTestIsAsync
= true;
29 function measureExBox() {
30 return parseInt(getComputedStyle(document
.getElementById('ex')).width
);
33 window
.onload = function() {
34 description("This test ensures that the CSS 'ex' unit is treated as half the size of the CSS 'em' unit when a font has no x-height information, or an x-height is synthesized.");
36 // We should either synthesize an xHeight or use half of the 'em' unit, but not 0.
37 // http://dev.w3.org/csswg/css-values-3/#font-relative-lengths
38 shouldBeGreaterThan("measureExBox()", "0");