View Single Post
Old 02-10-2018, 10:07 PM   #13
GeoffR
Wizard
GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.GeoffR ought to be getting tired of karma fortunes by now.
 
GeoffR's Avatar
 
Posts: 3,821
Karma: 19162882
Join Date: Nov 2012
Location: Te Riu-a-Māui
Device: Kobo Glo
The difference between line-height: 1.2; and line-height: 1.2em; is that when inherited, the unitless version will apply to the font size of the inheriting element, while 1.2em will be based on the font size of the original element.

e.g.
Code:
stylesheet:
div.em-units { font-size: 1em; line-height: 1.2em; }
div.unitless { font-size: 1em; line-height: 1.2; }
p { font-size: 0.5em; }

html:
<div class="em-units">
  <p>This text has line height 2.4 times its font size.</p>
</div>

<div class="unitless">
  <p>This text has line height 1.2 times its font size.</p>
</div>
GeoffR is offline   Reply With Quote