1.17 em is equal to 18.72 px.
The conversion from em to px depends on the context, specifically the font size of the parent element. Assuming the base font size is 16 pixels, multiplying 1.17 by 16 gives 18.72 pixels. This means 1.17 em equals 18.72 px in this scenario.
Conversion Tool
Result in px:
Conversion Formula
The formula to convert em to pixels is:
px = em × base font size (in px)
This formula works because em is a relative unit that depends on the font size of the parent or root element. In most browsers, unless changed, the default font size is 16 pixels.
Example calculation for 1.17 em:
- Identify base font size: 16 px
- Multiply em value by base font size: 1.17 × 16 = 18.72 px
So, 1.17 em equals 18.72 pixels.
Conversion Example
- 2.5 em to px:
- Base font size is 16 px
- Multiply 2.5 × 16 = 40 px
- Result: 2.5 em equals 40 pixels
- 0.75 em to px:
- Base font size is 16 px
- Multiply 0.75 × 16 = 12 px
- Result: 0.75 em equals 12 pixels
- 1.33 em to px:
- Base font size 16 px
- Multiply 1.33 × 16 = 21.28 px
- Result: 1.33 em equals 21.28 pixels
- 3 em to px:
- Base font size 16 px
- Multiply 3 × 16 = 48 px
- Result: 3 em equals 48 pixels
Conversion Chart
| em | px |
|---|---|
| -23.8 | -380.8 |
| -20.0 | -320.0 |
| -15.5 | -248.0 |
| -10.3 | -164.8 |
| -5.7 | -91.2 |
| -1.0 | -16.0 |
| 0.0 | 0.0 |
| 1.0 | 16.0 |
| 3.5 | 56.0 |
| 7.1 | 113.6 |
| 10.9 | 174.4 |
| 15.0 | 240.0 |
| 18.6 | 297.6 |
| 22.3 | 356.8 |
| 26.2 | 419.2 |
The chart shows em values in first column and their pixel equivalent in second, calculated by multiplying em with 16 px base font size. You can use it to quickly find px equivalent without calculation, but remember base font size changes may affect result.
Related Conversion Questions
- How many pixels is 1.17 em if the base font size is 20px?
- What changes when converting 1.17 em to px on different devices?
- Is 1.17 em always equal to 18.72 px in CSS?
- How to convert 1.17 em to px using JavaScript?
- Can 1.17 em be converted to px if the parent font size is unknown?
- Why does 1.17 em sometimes not equal the same px value?
- How to calculate the px equivalent of 1.17 em in responsive design?
Conversion Definitions
em: An em is a relative unit of measurement in CSS based on the font size of the parent element. If the parent font size is 16px, 1em equals 16 pixels. It scales dynamically when font sizes change, helping create flexible and responsive layouts.
px: A pixel (px) is an absolute unit representing a single dot on a computer screen. It does not change with context or font size. Pixels are fixed size units used for precise control over layout dimensions and visual elements in digital design.
Conversion FAQs
Does the base font size always stay 16 pixels when converting em to px?
The base font size is 16 pixels by default in most browsers, but it can be changed by CSS rules on the html or body element, or inherited from parent elements. Therefore, conversion from em to px depends on this actual base size, and not always fixed at 16 px.
Can converting 1.17 em to px cause layout issues in responsive design?
Yes, because em units scale based on font size and can vary between elements or devices. Directly converting to px can make layouts less flexible, causing elements to not resize properly on different screen sizes or user settings, which breaks responsiveness.
How does subpixel rendering affect em to px conversions?
Because pixel values can be fractional when converting from em, browsers round these to the nearest pixel or subpixel. This can cause subtle differences in rendering, especially with decimals like 1.17 em, sometimes leading to slight visual shifts or blurriness.
Is it possible to convert em to px without knowing the font size?
No, em is relative to font size, so without knowing the base font size or the parent element’s font size, you cannot accurately convert em to px. You need reference font size to calculate exact pixel values.
Why does the same em value produce different px results in different browsers?
Browsers may have different default font sizes, user settings, or zoom levels, affecting the effective base font size. Also CSS styles applied differently can change the parent font size, so same em values can convert to different px outputs in different contexts.