50 lines
1.4 KiB
HTML
50 lines
1.4 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<head>
|
|
<title>Vertical text using font with vmtx table and units per em</title>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
<style type="text/css">
|
|
@font-face {
|
|
font-family: 'droid';
|
|
/* DroidSansFallback-reduced.ttf was generated based on Android's
|
|
DroidSansFallback.ttf by removing many glyphs to meet the size
|
|
requirement of web font face.
|
|
It contains a vmtx table and units per pm 256 which is different
|
|
from the default value 1000. */
|
|
src: url('resources/DroidSansFallback-reduced.ttf');
|
|
}
|
|
#test {
|
|
font-size: 25px;
|
|
font-family: droid;
|
|
-webkit-writing-mode: vertical-rl;
|
|
}
|
|
</style>
|
|
<script>
|
|
if (window.testRunner) {
|
|
testRunner.waitUntilDone();
|
|
testRunner.dumpAsText();
|
|
}
|
|
|
|
function test() {
|
|
var height = document.getElementById("test").offsetHeight;
|
|
// If the units per em in the font is not respected, the height of the
|
|
// test div will be much smaller than 25*7.
|
|
document.getElementById("result").innerText = height >= 25*7 ? "PASS" : "FAIL";
|
|
if (window.testRunner)
|
|
testRunner.notifyDone();
|
|
}
|
|
|
|
window.onload = function() {
|
|
document.body.offsetTop;
|
|
setTimeout(test, 100);
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
The characters in the vertical div should not overlap.
|
|
<div id="result"></div>
|
|
<div id="test">
|
|
一丁丂七丄丅丆
|
|
</div>
|
|
</body>
|