Weblog of: Derek Keats
Blog Quick Search
Type a search term into the text box to perform simple searches through all blog posts
Follow me on Twitter Follow me on Twitter
Friend me on Facebook Add me on Facebook
Chisimba Facebook group Chisimba Facebook group


Related tweets
Login




Remember me

Forgot your password?
YES, HELP ME LOGIN

Weirdness with rounded corners in Firefox 13+
414 days ago

This is posted here because I am not sure if it is a bug in Firefox or a bug in Chisimba. I will try to keep track of it, and hopefully, one way or the other it gets fixed.


UPDATE: Will answer my own question as I usually do....

I replicated the bug in static HTML, and discovered that I had
    border-radius-topright:
in my stylesheet for dkeats.com (and in the canvas base stylesheet), but it should be
    border-top-right-radius:

It never turned up before because Firefox must have been parsing
   -moz-border-radius-topright:
but with version 13, they must have started parsing border-top-right-radius:

It was neither Chisimba NOR Firefox, it was just Derek being dumb.

Today, when I upgraded to Firefox 13, I found that a lot of the stuff that I had done with rounded corners was no longer working. It seems to only be a problem where the corners are not the same top and bottom, and where there are two elements with images in the background overlaying one another using the format

-moz-border-radius-bottomright: 6px;

and its cross browser equivalents. Effectively, this breaks almost all the skins we have in Chisimba, and I posted to Twitter 'Is Firefox the new Internet Explorer' where things that used to work suddenly stop and we have to bash out a new bunch of code to fix it. It is certainly annoying when stuff that used to work stops working, bug or no.

So here is the thing...

Here is an image of this skin with rounded corners and how they look on Firefox versions 12 and below, as well as Chrome, Chromium, and a few others. NOTE: Click image for larger view.

Here is an image of the same skin with Firefox 13 (and it does the same in Firefox Nightly).

All Chisimba skins with rounded corners do this in Firefox 13 and Firefox Nightly builds. It is not just the top of the page, but all the elements in the page that have rounded tops  where two elements are on top of one another do the same thing.

I don't know whether to log this as a bug against Chisimba or against Firefox. But browsers should not change their behaviour like that, even if it means it is getting stricter as it grows older.  Will try to ferrit this out and see that it is fixed one way or the other.