Update: I tried out the new Alpha release of Firefox 3.1 and…it works! They will finally support border-image and the nth-of-type selector. Obviously if your requirements dictate identical rendering between IE and Firefox — my condolences — this technique won’t help you out there, but for many (most?) projects I think that the combined marketshare of Firefox and Safari (around 25% by most accounts) gives enough critical mass for adoption of this technique. But YMMV.
I thought that since both Firefox and Opera have seen major new releases in recent weeks I should take a moment to report on how my Fancy Frames technique is holding up.
You may recall that I had high hopes of Firefox 3 adding support for this technique. Unfortunately, there is no love on that front. Firefox 3 renders my framed images in exactly the same way that Firefox 2 does. I verified that the border-image property is not supported with a separate test page to make sure it wasn’t just a lack of support for the :nth-of-type() selector. So, while it’s disappointing that border-image is not supported, the technique isn’t broken either. And there is a good chance that version 3.1 will support this technique as both border-image and :nth-of-type() selectors are slated as features for the next version.
It wasn’t until I looked at Opera that I was actually glad that Firefox works the way it does. Opera 9.5 breaks this technique slightly since it has added support for all the CSS3 selectors. So it recognizes my use of the :nth-of-type() selector, but it does not support the border-image property, causing my images to render with the uneven borders required by my frame image.
So the technique is broken in Opera (slightly) and I am unsure of how to fix it. I should stress that the technique still works well if you are using an image that is equal on all sides. But since Opera supports all the CSS3 selectors there is not an elegant method for making it work for my particular case. The good news for me is that my visitors don’t use Opera. I show exactly 2 visits from Opera users in the last month and only 1 was using Opera 9.5 — and that was me testing the new version. So, for now, I am not going to change anything. Hopefully, the next update to Opera will add the border-image property and then all will be right with the world. Well, except for IE of course, but what else is new?