I am trying to debug why having font-size: 1.0em
in jquery-ui is causing my font sizes for my page to go huge(over 16px) without me doing any actual resizing of the fonts. Well, in Firebug I saw a weird thing for an accordion.
At the base, it had font-size: 1.0em
but later that was overriden by font-size: 100%
. Could that cause some sort of problem with font sizing? I was always under the impression that 100%
was the same as 1.0em
An em is equal to the current font-size, for instance, if the font-size of the document is 12pt, 1em is equal to 12pt. Ems are scalable in nature, so 2em would equal 24pt, .
An em is a unit of measurement, relative to the size of the font; therefore, in a typeface set at a font-size of 16px, one em is 16px. The em square is the “box” that each glyph is sized relative to. So, at 12 points, the em square is 12 points wide.
So, by default 1em is equivalent to 16px , and 2em is equivalent to 32px .
If you use px as the unit for fonts, the fonts will not resize whereas the fonts with rem / em unit will resize when you change the system's font size. So use px when you want the size to be fixed and use rem / em when you want the size to be adaptive/dynamic to the size of the system.
Yes.
1em
and 100%
mean the same thing (for font-size) — "The same font-size as the parent element" (which is not the same thing as the font size the user has selected unless you are talking about the HTML element).
There are bugs in Internet Explorer when em
is used and the font size picked from the view menu is not medium
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With