Piotr ‘Riddle’ Petrus has released a simple JavaScript form to help calculate the em equivalent of a pixel size you want to emulate. I wrote a quick-and-dirty version of this in Excel to help with the typographic rhythm of my CSS framework but this is much nicer. You can add nodes below the body tag - h1, h2, h3 for example - set the pixel size you would like these to appear as and it automagically calculates the em value.

If you want to incorporate this into working with my CSS framework you’ll need to set both the “Default Browser Font Size” and “Body” values to 13px and set the “Show Decimals” value to 4. All it really needs now is a little extra coding to allow you to input a line-height value so it calculates margin and line-height values for any nodes you wish to get an em value for.

Thanks Piotr.

Apologies to everyone in RSS land I’ve updated the CSS framework post so you’ll get that post and this one telling you of the changes. Essentially, I have added some basic version information to each file, including the downloadable .zip and more interestingly added some vertical rhythm to the headings and paragraphs based on Richard Rutter’s excellent “24 ways” post.