em vs pixel vs %
Out of context: Reply #17
- Started
- Last post
- 23 Responses
- mjbauer0
If you are talking only about typography, you use a pixel height in the body declaration, because this makes it so you can start from the same point in all browsers. Then you use ems for font size and line-height, letter-spacing, etc. because when you adjust one, the others will change in relation to it.
Ex: You set your <p> font-size to 1.2em and your line-height to 1.4em (these are based on the 12px height that you specified in your <body> style). Then if you decide later to change your <body> font size to 11px the other measurements change in relation to it, and you don't need to edit those styles as well. If you used pixels on everything, then you would need to change each instance of font, line, and spacing measurement if you decided to change one, because they aren't relative measurements.
I'm not sure why A List Apart suggests using a percentage for your <body> style, because font sizes differ from browser to browser, platform to platform. It seems like it's best to unify this by setting the pixel size from the beginning, but maybe I'm missing something that would explain why their method is better.
Either way, this method has worked really well for me.