Resetting FONT size for all browsers

July 23, 2008 at 5:29 pm (CSS)

EM calculations

Sizing text is always an important part of making a usable design.
I start all my CSS files with the following rules:

html { font-size:100.01%; }
body { font-size:1em; }

The explanation for this comes from “CSS: Getting Into Good Coding Habits:”

This odd 100.01% value for the font size compensates for several browser bugs. First, setting a default body font size in percent (instead of em) eliminates an IE/Win problem with growing or shrinking fonts out of proportion if they are later set in ems in other elements. Additionally, some versions of Opera will draw a default font-size of 100% too small compared to other browsers. Safari, on the other hand, has a problem with a font-size of 101%. The current “best” suggestion is to use the 100.01% value for this property.

Permalink 1 Comment