What is the value of an em in terms of pixels?
10em = ?px ?
What is the value of an em in terms of pixels?
10em = ?px ?
There's no specific relationship between em and px. It's computed based on the width of the "m" character for each font-face.
While as others have said, there is no set ratio - as it varies from font to font - it is possible to calculate this for a particular font face/size combination by using DHTML.
Simply create a div with
style="width: 1em; visibility:hidden"
and append it to the place in the document you are interested about.
You can then find out its width by checking the div's clientWidth
property
It depends on the font and the platform you're rendering on. There is no universal ratio.
It's about 160px, if 1em is 16px and 10em = 1000%. It's just an approximation, which will depend on font, browser and OS.
If you are using a standard sized text font of 11 or 12px then a general rule of thumb is 1em is going to be about that big in pixels, so 11 or 12 pixels.
By default 1em
is 16px (font-size:100%;
), so 16px x 10em = 160px
You can change the size of an em
by changing the percent of the font-size
in the body, for example if you want to change the size of an em
to 10px, this would be your CSS:
body {
font-size:62.5%;
}
16px x 62.5% = 10px