Forum Moderators: not2easy
Up until now, I had always assumed that this feature would always work. On my computers, running Safari and IE6 (both of which have this function), all the sites I've done work with this feature no problem. I always specify absolute font sizes in pixels.
So imagine my surprise when I'm told that on this new site, this feature doesn't work. Oh, it works fine in Safari, and on my own version of IE6. However, on the client's copy as well as with a few of my programmers, it does not work. No text size change occurs.
Which brings me to my question: are there any CSS rules I need to abide by to make sure this feature works all the time?
So how do you do it? Well for starters do not specify fixed pixel size. There's numerous reasons for this. One: IE doesn't scale fixed pixel sized text... I don't know how you came to think that it did.
The second is if a person is running at a really high resolution, the text will be extremely small. Even if the text was resizable from pixel-size (like firefox and other browsers do), the user will have to manually increase their font size every time they visit your page!
A great concept invented long ago in the computer world was the idea of "uniform sizing" (that term I created myself. I think the proper term is "absolute" sizing, but I find that's EXTREMELY misleading, since it depends on your comparison reference).
It's basicly a system that makes it so that when printing, or when displaying something on a screen, no matter what printer, or what monitor, it will measure the same PHYSICAL dimensions. Points, (pt), Pica (pc), centimeters (cm) are all some possible measurements. The most common you'll see is the point (ex. 16pt font)
each point is 1/72 of an inch.
To get monitors and printers to display the proper size, they'd all have a "DPI" setting, meaning Dots Per Inch. DPI has to be changed every time you change monitor resolution (as far as I understand). Window XP just chooses an arbitrary DPI setting on all installs, and never asks you what it should really be. Any user not running that DPI should adjust it so that "absolute" measurements appear properly.
When DPI matches resolution matches monitor size, points will display properly. It will ensure that no matter what viewing media is being used, the font size will stay consistant.
Another very useful tool is the em unit of measurement (or the percentage notation, pretty much the same). This scales something bigger or smaller than the base size. The advantage to not using point, and just using em would be that the user's browser's default font size will be used as a reference, which is nice. The PROBLEM with that though, is with firefox, it's base font is in pixels, for whatever stupid reason, so the user's DPI setting has no effect, and must manually adjust the base font size in firefox in pixels to a size that is appropriate to his current DPI. That's not a huge issue, but many people might not know to do that, and wonder why IE scales up font size, but not firefox when EMs are used, on a higher DPI. One could also say the same thing about a user not knowing to resize their DPI setting though too, so it can go either way.
Sorry for all this text, I hope you can get through it in a clear manner.
Essentially for the font to be SCALABLE cross browser, all you need is to not use pixels. em and cm/pt/pc/in are the other two options.
