26 July 2008

16 ÷ 10 = easier

I use mostly ems for my font sizes in web design. There are certain times when I use % or px, but mostly ems. I typically use a formula where I divide the font size I want in px by 16—which in most cases is the default browser size. Now I actually found this simple math and easy to implement. For example, if I wanted 13px for my font size I simply put 0.8125em.

However, as I was thinking about it, it would probably make more sense to start with 10s (tens) rather than 16s (sixteens). But I guess being American, and having most of my life revolving around 12s, 16s and yards and ounces I didn't think twice. However struggling having a respect for my new homeland in the UK, I figured there must be something behind all this metric stuff. And sure enough 10s are a lot easier!

So, back to the css. I figure if I declared a base font size in the body other than 16 or 1em  based on 10 that life could be simpler. So using the same principles as above, I divided 10 by 16 and got 0.625. Which put in a percentage as my base size would allow me to simplify all other fonts sizes. So what use to be 0.8125em for 13px would now become 1.3em. Pretty handy eh!

example:
body {
font-size: 62.5%;
font-family: verdana;
}


Now thinking that I may have had a stroke of genius (which is unlikely), I thought I would further research this. Come to find out. . .most people new about this anyhow. So, if you are like me and sometimes slow to catch the bandwagon, I hope this helps.

0 Comments:

Post a Comment

Links to this post:

Create a Link

<< Home