1 <!DOCTYPE html>
2 <html><head><meta charset="utf-8">
3 <title>CSS Values and Units Test: support for the ch unit</title>
4 <link href="http://florian.rivoal.net/" rel="author" title="Florian Rivoal">
5 <link href="https://drafts.csswg.org/css-values-3/#font-relative-lengths" rel="help">
6 <meta content="" name="flags">
7 <link href="reference/ch-unit-001-ref.htm" rel="match">
8 <meta content="In vertical sideways, The ch unit is equal to the used horizontal advance measure of the 0 (ZERO, U+0030) glyph found in the font used to render it." name="assert">
9 <style>
10 span {
11 background: green;
12 color: green;
13 left: 0; right: 0;
14 position: absolute;
15 }
16 div {
17 background: red;
18 color: red;
19 position: relative;
20 height: 5ch;
21 width: 10ch;
22 writing-mode: vertical-rl;
23 text-orientation: sideways;
24 }
25
26 div + div {
27 height: auto;
28 }
29
30 div + div span {
31 height: 5ch;
32 }
33 </style>
34 </head><body>
35 <p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
36 <div><span>00000</span></div>
37 <div><span></span>00000</div>
38
39 </body></html>