Revert "remove body font-size and line-height"

[joeybaker]

(this is in concern of 125a7a6 )

I'm aware that some discussion went into this, but I'm against this change which removes the default font size from H5BP. It seems to me that font size is a pretty basic default that everyone is going to need to set. I'd think the correct solution for "not everyone likes this font-size" isn't to remove all settings, but to make a note that there are several common settings, or that this setting can be changed.

I'm aware that the browser provides defaults, but I'm not sure that a basic setting like font-size should be left to the browser.

A rant-y aside

I've noticed a trend in H5BP discussions:

1. User complains that setting X of H5BP is a bit strange for some reason.
2. Like-minded folks voice their agreement and suggest possible fixes.
3. The simplest fix proposed is to simply remove setting X. This compromise makes nobody perfectly happy, but solves the technical argument nicely.
4. H5BP becomes just a little less useful to folks starting out.

I mention this because I really see H5BP as a starting point – the whole point is to provide good defaults. Defaults can be changed, and may not please everyone, but they should serve two purposes:

• Showing a dev that a hack/option/setting is something they should think about.
• Solving a common problem that everyone has and needs a way around.

IMHO

[paulirish]

The first question on this issue is.. are the default font sizes and line-heights of browsers in need of normalizing?
If they are consistent, then we don't need the setting, just like the rest of normalize.css

[davidmurdoch]

There is def a better way to do this...but whatever:
http://jsfiddle.net/musicisair/geycD/embedded/result/

qr (for mobile):

The following browsers have a default font size of 16px on the body element:

Chrome 16 (dev channel) (windows 7)
FF 7.0.1, IE 9 (windows 7)
Opera 11.52 (windows 7)
Safari 5.1.1 (windows 7)
IE 9 (windows 7)
Chrome 14 (vista)
IE 9 (vista)
Default browser on Android 2.2

The following browsers have a default line-height of 1.1875 (19px) on the body element:

Chrome 16 (dev channel) (windows 7)
FF 7.0.1, IE 9 (windows 7)
Opera 11.52 (windows 7)
Safari 5.1.1 (windows 7)
Chrome 14 (vista)
Default browser on Android 2.2

IE 9 (vista and windows 7) has a default line-height of 1.125 (18px).

That's all the browsers I feel like testing at the moment.

Still need to test iPhone, Mac browsers, Android browsers, other mobile browsers, old IE, and browsers on Windows XP.

[necolas]

I'm not sure that a basic setting like font-size should be left to the browser.

In most cases, it already is. They all default to 16px. So everyone out there starting with a base font-size of 16px, 1em, or 100% is just redeclaring the browser default. Anyone using any em or % value on body (which was/is standard practice to avoid breaking text-resizing in legacy versions of IE) is taking the browser default font-size as a given.

I've noticed a trend in H5BP discussions...

That isn't a fair characterisation of the discussion or resolution of the issue that brought up font-size and line-height, or any of the others.

Anyway, I've pushed some placeholder defaults. I don't think these help solve any common problems (and the font-size is entirely redundant) but this way hopefully we can move on and devs can change the values as they need to.

[joeybaker]

@necolas

Thanks for the change! And, apologies – I didn't mean to offend. I don't mean to say that I've noticed this as a prevalent issue, just a trend – something I've seen a few times now.

At any rate, sorry for coming off a bit troll~ish and thanks for the change!

[joeybaker]

To add to some more of your tests:

• IE8, Win7: font-size: 16px, line-height: 18px
• IE7, Vista: font-size: 16px, line-height: 18px
• Chrome 15, Mac: font-size: 16px, line-height: 18px
• Chrome 17, Mac: font-size: 16px, line-height: 18px
• Safari 5.1, Mac: font-size: 16px, line-height: 18px
• iPad 2, iOS5: font-size: 16px, line-height: 19px
• iPad 1, iOS4: font-size: 16px, line-height: 19px
• iPhone 4s, iOS5: font-size: 26px, line-height: 30px
• iPhone 3Gs, iOS4: font-size: 16px, line-height: 19px
• FF 7.0.1, Mac: font-size: 16px, line-height: 21px
• FF 8b, Mac: font-size: 16px, line-height: 21px
• FF 3.6 Mac: font-size: 16px, line-height: 16px