I came across an interesting discovery today regarding the Firefox rendering engine. Most web developers are aware of Standards vs Quirks mode in the current browsers, however I was never aware that Firefox actually had THREE different rendering modes; Standards, Quirks and Almost-Standards Mode.
I happened across this today when changing a site from a valid XHTML 1.0 Transitional doctype to an XHTML 1.0 Strict doctype, and it made a tiny rendering change in the page. When I switched to the Strict doctype, some content on my page moved down one pixel. Having always thought that since both were valid doctypes, both should render the page in standards mode, I went on a hunt to find the exact differences between the Transitional and the Strict doctype.
It seems that Almost Standards mode was created to keep table based layouts working properly once CSS layouts were starting to take hold - and according to Mozilla, rendering in that mode should affect nothing other than images within tables.
I beg to disagree.
While I couldn’t get a test page together, I did enough quick testing to tell that the issue I was seeing definitely was being created by an image. Putting the page in full standards mode made it render the same as IE. Once in full standards more I could turn the issue on or off by changing the display on the image from inline to block. Inline gave me the extra pixel, block took it away. The behaviour seems consistent with why Mozilla implemented Almost Standards mode in the first place. Images displayed inline get an extra gap for the decenders in lowercase letters.
I’m not sure why I’m seeing this issue on a site with no tables, and I’ve probably never come across it before because I hardly ever use a Transitional doctype. It is however a small annoyance, and will certianly keep me using a Strict doctype.