I usually designate a font size in my CSS on either the html or body tag using a percentage then size the rest of my document using ems. The reason I use a percentage value instead of just specifying the base font size in pixels is so that users can change their font size in their browsers if they choose.
Since most, if not all, web browsers use 16px as their base font size I can set my base font size using this formula:
percentage = 100(base font size/16)
Just insert your desired base font size in pixels into the formula and you will have the correct percentage to use in your CSS.
And now a handy cheat sheet if you don’t want to do the math:
| Pixels | Percentage |
|---|---|
| 8 | 50 |
| 9 | 56.25 |
| 10 | 62.5 |
| 11 | 68.75 |
| 12 | 75 |
| 13 | 81.25 |
| 14 | 87.5 |
| 15 | 93.75 |
| 16 | 100 |
| 17 | 106.25 |
| 18 | 112.5 |
A quick disclaimer: there may be a browser out there that doesn’t use 16px as its base font size that I don’t know about. Also, this works only if you haven’t already changed your font size somewhere else.