CODEWITHSUNDEEP
jqueryhtmlcss
Hung PD
Hung PD

Reputation: 405

Default percentage font-size on the html element

I set the default html font-size is:

html{
    font-size: 75%; /* 12px */
}

Then set body font-size like below:

body{
    font-size: 0.75em; /* 12px */
}

Now, I'm gonna set 14px for p tag so it will be look like:

p{
    font-size: 0.875em; /* 14px */
}

But when I check on the browser, it looks so small. What's wrong with my above code? Thank in advance.

Upvotes: 0

Views: 146

Answers (1)

DeBug
DeBug

Reputation: 19

em scales with font size. So 1 em is current font size and 0.5em is half of it. Start with 12px (75%) then apply 0.75em you are at 9px if you then apply 0.875em on the 9px you will get 8px.

This link should make things clear: http://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/

Upvotes: 1

Related Questions