test/render/css-1-line-height.htm


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<!--
Issue #232.
This file tests line-height inheritance. 
Adapted from https://web.archive.org/web/2022/https://developer.mozilla.org/en-US/docs/Web/CSS/line-height#prefer_unitless_numbers_for_line-height_values

normal and 1 give the same line-height here because em height == ascent + descent in the raster font used in tests.
In outline fonts it is not usually the case, for example in Times New Roman 16px  ascent + descent == 19px  (this is the value
that is used for line-height when it is "normal")
-->

<style>
body > div { font-size: 32px; display: inline-block; vertical-align: top; border: 1px solid black; }
div  > div { font-size: 16px; }
</style>

<div style="line-height:normal">    <div>normal<br>normal</div>     </div>
<div style="line-height:1">         <div>     1<br>1     </div>     </div>
<div style="line-height:100%">      <div>  100%<br>100%  </div>     </div>
<div style="line-height:1em">       <div>   1em<br>1em   </div>     </div>