A while back, I read the following article at WebMonkey entitled "Sizing Up the Browsers".

I was most impressed with the information about text sizing on page 3 of the article. My thought was, if we know exactly what font specifications we need to achieve the same size in all browsers, and browser detection is relativly easy these days, why are we still solving this problem by hand? It seems that all the pieces exist to solve this problem, and they just need to be pulled together.

Well, as I'm sure all of you know, it's a lot easier to provide a problem than it is a solution. I took a stab at a solution and I would like the input of the community regarding it.

Ok, code first, explanation later:Note: This is far from polished. There is a possibility that using this script will return errors. There are other variables that need to be accounted for, such as unrecognized browsers, that must be addressed before production use.

The code is rather simple. It parses CSS looking for font-size attributes. When it finds one, it looks at the value for the font size and the browser being used to view the page, and translates it into an equivalent value for that browser.

Currently, all font-sizes in the CSS must be set as integers that correspond with the sizes of font size HTML tags in IE6 for Windows. The idea is, if the fonts are the correct size in that browser, this script will make sure they are the same size in any. I believe in the future it would be possible to make the script handle font-sizes that are specified in other forms than integers.

The script also allows for a designer to choose what format the sizes should be in the style sheet. The script can translate sizes into size keywords (small, medium, large, etc.), em's, pixels, and points.

This has some distinct advantages over Javascript style sheet switchers. First, the designer needs to only make one style sheet, and any changes made to that sheet are automatically reflected in any browser. Second, this code can accomodate a much wider range of browsers than a Javascript solution because it automates the transformation of sizes and is entirely server side. Because this is a server side solution, it will work for browsers that do not support Javascript, or browsers in which Javascript is turned off.

There is also one disadvantage. Any page that uses this script would have to be a PHP script. This could slow down load times a bit because the page would have to be processed by the PHP parser, but I think it would be completely unnoticable.

Do you think this can be developed and polished into a viable solution for automatically making fonts appear at the same size in any browser?

Any suggestions for improving this script would also be greatly appreciated.

-Bryan
cyngon@planettribes.com