On Tuesday the Mozilla Corporation decided to set a world-record for number of downloads in a day for their new Firefox 3 web browser.
Even though I love Opera and would never, ever part from it, I decided I would do my part and download Firefox 3, to help Mozilla set their record.
Of course, Firefox couldn’t have predicted that their PR scheme would result in a self-inflicted DDoS attack on their servers. 😆
I installed Firefox 3, to keep it around as a back-up browser. (Some websites will work only in IE or Firefox. Opera and Safari users, we might as well be lepers.)
And then I discovered that my website was unreadable.
I surfed the ‘net. I discovered that about half the websites I visited were unreadable. Fonts were rendered very small for some reason.
I think it’s a bug in the Gecko 1.9 engine that Firefox 3 uses.
Through trial and error I discovered that this line of code —
font: 70%/1.5em Verdana, Tahoma, arial, sans-serif;
in my stylesheet I had to turn into this —
font-family: Verdana, Tahoma, arial, sans-serif;
and then everything was fine.
Strangely enough, it worked fine as is in Firefox 2.x, Safari, Internet Explorer, and Opera, but in Firefox 3, it broke.
And now we’re good to go. 🙂
But you know what I miss when I look at the website in Firefox? The text shadow effects on titles. I guess text-shadow is one CSS3 selector that hasn’t made it into Firefox yet, even though it’s in Opera 9.5 and Safari 3. *shrug*
ETA: You know what? Scratch all that. I had to undo the change I made to style.css, because even though it made things readable in FF3, everything became giant in other browsers.
This requires more research.
ETA(2): Research turns up that Firefox 3 handles em measurements oddly. So, the line
was changed to
And now everything is legible.
ETA(3): Nope. The problem was on my end. I think.