1
2/* The font "silkscreen" subsetted to only contain the"H" (capital h) glyph
3 The "H" glyph in this font happens to be exactly 10 pixels wide by 14 high
4 Furthermore, we can use a line-height of 0.71428571428 to scale the height to 10 pixels
5
6 By combining H's with zero-width space characters (​) we can reliably set an elements
7 min-content and max-content sizes.
8*/
9@font-face {
10 font-family: 'silkscreen-h';
11 src: url(data:application/font-woff2;charset=utf-8;base64,d09GMgABAAAAAAOAABAAAAAAB7wAAAMkAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GVgCCWggoCWQRCAqBZIFjCw4AATYCJAMYBCAFhAgHRQxTG5IGAC4GnDLLNaI4Ih4+4mqyRg9HHA8fX6MqHp72+9+vvWfOXEdEkkaIJglvYpJJhEbI4o0QLSQ8tJ/ez/fn9/eeN4h3Sl/w0L7uB5CWVVeaGMPcBJ633fsTGVBiIcZj6bwqRjr/xwv9r0t5/9KdBfjyxtcttVqp2BpQ5igTsIwHKEClWemU7qWRJxTUvMlUEGFYTu6MiB4KAT+fp/dg+5v9Fv69218CBMZYBKQQOqEiEXk09nVq/s6XeKGtjZ/YGaTvuOsU8iDXv/GnFcEbKGugCQSgoGAFApzQKrBCmx3AUF9KE2vo188/xL88/d//tz8HAgCiEYBIJJqaQGH+cAUj836+xIwmiKdguu3lmr40xRRttVIHO9vba0mbR4MOy0bNii8ytRLxqinknInaInQ5/fyRo50El0++w51kOyRDQbdLiMP9JaQ7ndb6ImiT0iv8w9zYdBmYv0UBQkyZDRoYo2IJsAKAiqdaACFqHddRN6mnHNuQ1xoZxagOY6ibXWetv11yO7O8lNrMNr/YtP2GLBIM+xS27eNenffMPGrd71AqqStRoU7XEGjzf4SiWL7W1joeDmyy35U6kk1Hw1JyFFqXJYz6vaKF/UPjTYGsxZIgaOLfZSQfyPCjxejHY90mIBDM3vrQeXa2+LVrsW3mZzN9onlv0ZcgKGv+G/lfRwME063FM+sBMbP03UqzskBpxvIcqW+nHpxmAGDshSLqAEdAjLCAHWnsEopVMqjW2UVnh0M0C9zhiwk/+IqeEXzTFbu13w3E4Yl+FMuyKQ9LCUL8csB9bl9eLPMpwHKJgjRmMTEvLUUufpyCgjiMKi0nzCUqIS4vIAfDUqz1cJKPTefqCrvV87VoxnEZqOgQF58CRKEoDGFiQBg4hNjYhJj4l0Ng1adXbsD8Qm8ULUC3oeIOPrmyBGGh1yt5hDi40xlH52nomGIchmVkdMjyhaI87eSvdMkqisrJwRJagGndGDN+IzKKYlPa2tVb1UyE0Vm8E6WDQ+0fisnRquQDfePRqLVMer19ufM5pj3RRNRTJ2E/0i2NeZW75H150GioP1GlAAA=) format('woff2');
12 font-weight: normal;
13 font-style: normal;
14}
15
16body {
17 padding: 0;
18 margin: 0;
19}
20
21div, span, img {
22 box-sizing: border-box;
23 position: relative;
24 border: 0 solid red;
25 margin: 0;
26 padding: 0;
27 display: flex;
28}
29
30body > * {
31 position: absolute;
32 border-color: red;
33}
34
35#test-root {
36 font-family: silkscreen-h;
37 line-height: 0.71428571428;
38 font-size: 14px;
39 color: white;
40}
41
42div {
43 background-color: #222;
44}
45
46div > div {
47 background-color: #444;
48}
49
50div > div > div {
51 background-color: #666;
52}
53
54div > div > div > div {
55 background-color: #888;
56}
57
58div > div > div > div > div {
59 background-color: #aaa;
60}
61
62div > div > div > div > div > div {
63 background-color: #ccc;
64}
65
66div > div > div > div > div > div > div {
67 background-color: #eee;
68}