A few years ago, Opera was the alien de rigueur. It seemed like it did nothing like the others.
I was so naive as to think there was a right and a wrong way to implement the W3C’s recommendations. Now that I’m older, I understand that many things aren’t explicit in them. You can implement so-called standards (recommendations, really) and end up displaying inconsistent things. It’s your job as a CSS developer to be as explicit as possible. Here are the two main differences that shocked me:
- Opera did not give the "right" width to a floating parent containing floating children. Instead of adding all the children’s widths and computing the sum as the parent’s width, it would size the parent like the widest of its children. You had to guesstimate the total width and set it to the parent, otherwise down the drain went your design.
- Opera did not increase or decrease the font size of a page: it zoomed the whole page, images included!
And then came the others
In the meantime, Mac OSX went out. Its display engine is based on OpenGL, and it enables Apple to include in their OS —hence in their browser— a native zooming feature, at no extra cost!
Adding this and that, now that time has passed we are beginning to find full-fledged zooming more natural. Look here (waves at the iPhone): a double-tap of a finger and BAM!, the whole content zooms in or out. Safari at work.
Internet Explorer 7 being the latest IE, it inherits some glitches from its predecessors, even though the IE team has done a tremendous effort to address many standards-related issues.
Case at hand: pixel-sized fonts. For many years, IE has dealt with pixel fonts as an absolutely-absolute measure, so you couldn’t zoom in or out like all the other browsers out there did. That’s sad, because the specification just says that although absolute measures are used, they should be relative to the viewport, to the screen’s DPI, etc.
Come to think of it, I’m sure IE does do some computing on font sizes. After all, I kind of remember reading that a few years ago Windows went from 72 dpi to 96 dpi. I suppose that internally IE is using a conversion rule that says «OK, the CSS is saying 12 pixels, which is an actual 16 pixels on my brand-new 96 dpi system. I’ll just add one third and tada, sleight of hand, it still will feel like a 12-pixel rule.» [1]
So, IE7 comes out, and for compatibility reasons (I suppose) this pixels-set-in-stone rule has endured. But there’s a new thing: IE7 zooms the whole page in and out, like Opera has done for so many years. True, there are still painful glitches [2].
Now we’re told that Firefox 3 is slowly coming to life and will be out this year. Guess what? This one, too, will have full-page zooming, not just font-size recomputing. Bear in mind that from the beginning Firefox did increase/decrease fonts, be they in pixels or ems or percents.
So, here we are today. The undercurrent is very clear: all major browsers now have the capability of forgetting painful em calculation. Zoom in and you’re done.
Zoomed stylesheets, right columns, etc.
Joe Clark refers to a study (Reddish et al.) that shows that when people use zooming tools, right columns are ignored. Hence the idea of zoomed stylesheets that not only increase font size but also linearise the content in only one column, the width of the browser window.
One point to keep in mind in the coming years, then: how on earth will people understand that fully-, automatically-zoomed content has content further than the right edge of the browser if we don’t keep on doing zoomed stylesheets (or, for that matter, if we don’t disable CSS altogether)?
So, what do we do now?
Hence my question: Are pixel font sizes still so bad? Do we still need to bother each and every CSS developer we encounter with all the maths involved?
What do you think? I’m beginning to ponder for good going back to using pixels in my CSS with no scruples whatsoever. Pixel-based CSS definitions are really becoming what they were originally thought out to be: relative.
