Point vs Pixel

[gthorley]

Can someone tell me when I should set the font size using point and when using pixel. It seems that if I want to have my text look the same size regardless of what resolution the user has set then use pixel otherwise Point.

Should I be taking more into consideration than this?

[creole]

But even then you cannot guarantee the end result. Some monitors have a 96dpi resolution instead of 72.

One of the best overall units to use is em. That way you are not tied into any OS specific measurements. It's all browser.

[malleron]

Take a look at this article from A List Apart:

Give Me Pixels or Give Me Death

Deciding which to use is ultimately up to you, but it always helps to have a little perspective on the issue.

Good luck!

[HumanClay]

creole, what is the exact size of em? Say I want to make my fonts appear to have size of -1 (or 2) using the normal font tags. What would I set the size to be using em?

font-size: xx em; ??

[mmj]

As far as I know, an "em" is the height of a capital letter in the current font.

An "ex" is the height of a lowercase "x" in the current font.

Therefore when you apply "em" or "ex" to a font-size, it is relative to the current font.

For example a font-size: 1.5em would mean that the font is 1.5 times the height of a usual capital letter "M"

If you need absolute font size, then this is the wisdom (ie it is the theory):

Using 12px means that the font height is 12 pixels.

Using 12pt means that the font is the height of a 12pt font in your operating system. If you have large fonts installed, it will be more than 12 pixels.

So I'd recommend using 12px if you need it to be a DEFINITE number of pixels high, otherwise use 12pt.

And use "em" if you have a default paragraph font, and want it to be relative to that default font.

[mmj]

Do you have this link?

http://www.htmlhelp.com/reference/css/properties.html

[creole]

human clay...

"1" is the default em size. To go larger, you go 1.1, 1.2 etc. and the opposite for smaller.

mmj...good link.

www.zvon.org is another good reference.

[HumanClay]

Thanks for all the info guys!

[mmj]

According to CSS, the 1em is supposed to be the size of the parent class, but in IE3.x this is not so. I guess nobody needs to worry about IE3 anymore, though

So if you have a

<p class="classone">home<span style="font-size: 1.2em">work</span></p>

Then the word "work" will be 1.2 times the size of "home", and "home" will be the size defined in the "classone" class.

As far as I know...

[edit]
However, I believe if you had a
.classone span { font-size:16pt }
defined, then the "work" would be 1.2 times the size of the "classone span", rather than 1.2 times the size of "classone"