CODEWITHSUNDEEP
htmlcss
michaelmcgurk
michaelmcgurk

Reputation: 6509

EMs, REMs, PXs - Converting PTs to EM/REM

I have the following HTML code:

<h1>Hello World</h1>

I am styling this with:

h1 {font-size:100pt}

How do I convert this 100pt to EMs & REMs?

Upvotes: 0

Views: 522

Answers (1)

Pankaj Parashar
Pankaj Parashar

Reputation: 10192

In CSS,
- A pt is 1/72 of an in, and a px is 1/96 of an in.
- A px is therefore 0.75pt OR 1pt is equal to 1.3333px.

1. Convert pt to px - 

1pt = 1.3333px  
100pt = 1.3333 * 100px = 133.333px

2. Convert px to em - 

 1em = 16px (Typical Assumption)  
 133.333px = ?em = 8.333em

3. Convert px to rem - 

10px = .625rem (Assuming `:root` font-size is `16px`)  
133.33px = ?rem = 8.33rem

Upvotes: 1

Related Questions