Finding/setting css line-height defaults

Question

One strange thing I've noticed when trying to normalize my css across browsers is that default line-height properties for h-elements and other major tag types are different across browsers like Chrome and Firefox, and yet are not set at the user-agent level:

• http://codesearch.google.com/codesearch#OAMlx_jo-ck/src/third_party/WebKit/Source/WebCore/css/html.css
• http://mxr.mozilla.org/mozilla-central/source/layout/style/html.css

Moreover, popular normalizers like normalize.css don't take care of that either.

So my question is two parts:

1. If line-heights aren't set at the user agent level, where are the default values coming from?
2. I'd rather not normalize line-heights myself, but if I have to, where is a good example of some defaults?

Solution

I agree that "things aren't meant to be exactly the same" is somewhat of a cop-out, especially as even IE comes on board with pretty good standards adoption.

Relative (120%, 1, 1em) line-height values are based on the computed font-size, Normal is supposed to be based on font size but it can and does vary from browser to browser, as you can see by opening up this example in FF and Chrome: http://jsfiddle.net/mahalie/BSMZe/6/

I generally look to HTML5 Boilerplate for queues on best practices since it is so popular (and therefore well vetted / under a lot of scrutiny. They use:

body { margin: 0; font-size: 13px; line-height: 1.231; }

And their discussion of it is quite interesting although no perspective is the clear winner: https://github.com/h5bp/html5-boilerplate/issues/724

Comments

[Yarin]

@mahalie- Thanks for stepping up and giving a real answer! Great links. +2

[Andrew B.]

Link should now be github.com/h5bp/html5-boilerplate/blob/master/css/main.css

[Alejandro García Iglesias]

This is outdated as they're clearly using a different (and more accessible) approach right now by letting the browser use it's default values.

[Rory O'Kane]

HTML5 Boilerplate now uses line-height: 1.4;. You can see it on this line in the CSS.

[Atul Kumar]

Can't believe people are still using this thread, thank you @Teepeemm for updating my answer :D Happy baselining all...