I don't know if I am jumping the gun however I decided today to install firefox beta three as it will be coming out fairly soon and I was shocked to see what the main site I work on looked like! Kaboom!!!
Among many problems I have been sorting out is the heavy use of
display: inline-block;
When I was given the template for this site and I was suspect of this but I figured since I wasn't told to do the design I would just leave it be and it was fine - of course, until I looked at it today in beta 3...
Aside from an FYI, I do have a question...
Even though it isn't supported in firefox 2 why is it that it didn't cause the massive problems it caused in beta 3. Is it a problem with the beta software? I assume not - It just says that it isn't supported.
inline and block are basically opposites. Try making all your display:inline-block's into display:block. Since inline-block is invalid, maybe FF2 was defaulting to block, and FF3 is defaulting to inline. Try it out and let us know what you find.
inline-block ISvalid css 2.1, and is supported by IE but not FF. Where inline-block is used, another method (usually table or table-cell display, which IE doesn't support) is normally set for FF. If both of these methods are used within the one css block, it could cause trouble with a browser that supports both, and this may be the case with FF3 beta.
Personally, I try to avoid these display methods unless they can be targeted to specific browsers that support them.
Hmm... No table-cell isn't used so that isn't the problem.
What I did was completely remove the used of "Display: inline-block" in the entire style sheet. It doesn't seem to affect the layout in i.e. 7 or firefox 2 or beta 3.
I guess the question is - what is the possible ramifications of this change, I mean it looks OK but that doesn't meant that it is for sure...
Bookmarks