Sorry for silly question!
I have psd file and In the header :Some text: has font-size 120pt;
But I don't want to use pt I want to use em so is it possible to convert pt to em?

- 9,233
- 15
- 67
- 131
4 Answers
This is the tool I use: PXtoEM.
Just remember that EMs are relative to the base PX font-size.

- 1,358
- 2
- 11
- 23
-
How do I know a base pixel size? – user2950593 Apr 18 '14 at 19:32
-
@user2950593 You don't. You can guess tho. Most of the time it's 16px. – bjb568 Apr 18 '14 at 19:42
-
@user2950593 It's the value inherited from parent elements. `1em` is essentially `100%` rather than a physical measurement like `pt` or `px`. – Jonathan Lonowski Apr 18 '14 at 19:43
-
You can also set it explicitly on either body or html from within your css file. html { font-size: 16px; } – HJ05 Apr 18 '14 at 19:57
You cannot, any more than you cannot convert dollars to euros without knowing a conversion rate, which varies. Once you know a conversion rate, the problem is trivial.
Questions like this are mostly answered on false premises that expect 1em
to be 12pt
. This is incorrect on two accounts. First, the em
unit is the size of the font of the element (for most properties) or the size of the font of the parent element (for font-size'). Thus, it need not be the same as the root element
emvalue. Second, the root element
emvalue varies. It was common to think that it is
12pt` by default, as it often is, but it is easy to see that e.g. in mobile phones, the default font size is nowhere near that.
So, you can’t. If you need to produce a specific layout specified in points, then use pt
. If you want to produce it in a manner that adapts to the basic font size, then use em
and replace the pt
values by em
according to some consistent scheme. The conversion rate is up to you, or the designer.
(A font size of 120pt
might make sense on a page tailored for presentation on a movie screen or comparable huge size. You should compare it with the size set on body text.)

- 195,524
- 37
- 270
- 390
There is no clear cut relationship between EMs and PXs, because EM sizes are based relative to the size of the font, whereas PX sizes are based relative to the screen resolution. Since those two elements are disparate, no exact correlation can be made.
There are ways, however, to get fairly close. One method is to set the base font size (the font-size property on the element) to around 62.8%. This makes the base font, or 1.0em, approximately equal to 10px. It's not exact, and changes from font to font, but generally speaking it's pretty accurate. With that font setting in the body, you can use EMs as px equivalents like so...
1.0em = 10px
1.1em = 11px
1.2em = 12px
2.0em = 20px
5.0em = 50px
etc.
There are a few caveats, however, the major one being that it isn't a precise conversion so elements that must be EXACTLY Xpx are unlikely to be so. The other big danger is that setting the base font this small makes IE text resizing somewhat problematic, as this 62.8% size becomes the "meduim" setting for IE. Since IE only allows two font-size increases ("large" and "larger"), those who need larger fonts may not get a big enough size to suit their needs. Likewise, sizing down to "small" or "smaller" makes text virtually unreadable.
But otherwise, it's a very practical technique.

- 147
- 1
- 12