Hacker News Reader

Comment by pjc50 | Hacker News Reader

     body {
	font: 0.8em/145% georgia,times,serif;

What does that even mean?

View on HN

A (default) letter height of about 13px, with about a 5px space in between the lines.

It’s CSS shorthand.

font-size/line-height font-family

An Em is a typographical unit that basically means “the current font size”, so it actually nests in CSS/HTML.

Default browser font size tends to be a 16pt pixel equivalent. So in this case this is 80% of that.

Line height is obvious I think, but yeah - it’s in a % of the current font size.

They’re just standard typography syntax (the “size/height” bit anyhow) and units moved into CSS with no change.

Actually I never realized this but aren't em and % actually the same then? 0.8em = 80%

There is one caveat relating to default browser font size, but yes:

https://kyleschaeffer.com/user-experience/css-font-size-em-v...

Unfortunately issues arise when using em's in Android webview compared to Chrome. Em's get rendered about 8x in webview, even though the Chrome emulator shows otherwise. I tried the % way but that doesn't fix it either.

In font sizes yes, other sizes not so much :-) (I couldn't reproduce the issue highlighted in musage's source by altering Firefox' default font size, but perhaps that's an IE only thing.)

In this case yes. But you can use em as a unit anywhere. Set your div elements to 20em width if you like.

Now you have a layout that scales with your text!

Slightly smaller than the default font size, with an increased line height.

Reply on news.ycombinator.com