The following table applies to a browser that is set to 'medium' font-size (the standard). Since most websites use a standard 12px font for text, I set the body font to this value so that the EMs are pegged at 12px (i.e. 1em = 12px).
Base (from browser): 16px;Body (CSS): 75% (12px);
Befor getting to the conversions, take a look at the above values. You'll need to set your BODY tag to font-size: 75%. 75% of 16px is 12px, this is what we want to work with or else the table below will not work.
Conversions
Column 1: Desired in px | Column 2: Outcome in em
0px = .000 em
1px = .083 em
2px = .166 em
3px = .250 em
4px = .333 em
5px = .416 em
6px = .500 em
7px = .583 em
8px = .666 em
9px = .750 em
10px = .833 em
11px = .916 em
12px = 1.000 em
13px = 1.083 em
14px = 1.166 em
15px = 1.250 em
16px = 1.333 em
17px = 1.416 em
18px = 1.500 em
19px = 1.583 em
20px = 1.666 em
21px = 1.750 em
22px = 1.833 em
23px = 1.916 em
24px = 2.000 em
Again, the formula is: desired-font/parent-font = font-in-em (i.e. 10/12 = .833em)
Hope this helps!
No comments:
Post a Comment