I’ve been working a lot on my UI project, making sure it works correctly when browser is in standards compliance mode. With IE there are no troubles. I turn strict compliance on and everything works great. With Gecko, it is not so simple.

When Gecko enters a standard compliance mode not only does it enforce correct CSS, but also corrects JavaScript. I missed the second part initially, since I never saw it being mentioned anywhere. Partially I made the mistake because I wasn’t completely familiar with the tools I’m using. Firefox has JavaScript console (Tools -> JavaScript Console) that reports any errors, warning, and general messages. If I were to look at it when I first encountered following problems or when I was writing the code I could’ve saved some time.

There are two differences in the way JavaScript works that I have discovered. First in the standards compliance mode it’s illegal to reference DHTML elements by ID directly. So instead of doing someElement.tagName I have to do document.getElementById ( “someElement” ).tagName for the script to be valid. The second problem is related to accessing CSS from JavaScript. When a number is used as a value of any CSS property the unit must be included unless the number is zero.

I’m actually glad that Mozilla enforces those rules, although I wish there would be an easier way to learn about how the browser’s behavior changes in modes. The best article on the subject I found is http://www.mozilla.org/docs/web-developer/quirks/quirklist.html (from http://www.communitymx.com/content/article.cfm?page=2&cid=E2F258C46D285FEE).