694885 - CSS border-radius can't be set from JavaScript element.style.MozBorderRadius

Status: RESOLVED INVALID

(Core :: CSS Parsing and Computation, defect)

Description

[rochal]

User Agent: Mozilla/5.0 (Windows NT 6.0) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/14.0.835.202 Safari/535.1

Steps to reproduce:

On Firefox 7.0.1 I tried to set border-radius on a div using JavaScript, using the code below:

document.getElementById('jsTest').style.BorderRadius = "10px";
document.getElementById('jsTest').style.MozBorderRadius = "10px";

I also set up a demo page, here: http://rocha.la/misc/ff7-radius-bug.htm.


Actual results:

Radius was not set. MozBorderRadius and/or BorderRadius did not change the radius of the border. It still works when applied from CSS, but JavaScript call is not changing the property.


Expected results:

Border radius should be set as it is in Firefox 3.6.

Follwoing code should correctly update the radius of a border: element.style.MozBorderRadius or element.style.BorderRadius

Comment 1

[j.j.]

> Radius was not set. MozBorderRadius and/or BorderRadius did not 
> did not change the radius of the border

CSS "-moz-border-radius" (and thus "MozBorderRadius" in scripting) is no longer supported.
Use CSS "border-radius" (means "borderRadius" in scripting).
"BorderRadius" is just wrong.

(The rule is: uppercase (only) the letter after the dash)

Comment 2

[j.j.]

Hoppla! -moz-border-radius isn't droppes yet but soon, see bug 693510 .
In any way, don't use it!
Plain "border-radius" works in amy browser these days, including IE9. See https://developer.mozilla.org/en/CSS/border-radius

So  style.MozBorderRadius  should still work in Fx7 (But don't use it)

style.borderRadius should work.

Comment 3

[j.j.]

Attachment: wrong, use the next one

Works in any browser.

(Did I mention I hate JQuery? And that I will refuse to work an any bug with a testcase were jQuery is involved in any way?)

Comment 4

[j.j.]

Attachment: testcase (this time the right one, sorry)

Comment 5

[rochal]

Thanks j.j. In other words, Firefox is no longer backwards compatible as style.MozBorderRadius does not work in Firefox 7.0.1.

Documentation on this change would be more then useful.

Regards

Comment 6

[j.j.]

Actually, you are right, I didn't know that!
Support for  style.MozBorderRadius  was dropped with Fx4,
support for  -moz-border-radius  will be dropped soon with bug 693510 (and documented then).

> Documentation on this change would be more then useful.
Indeed! Seems that was forgotten.
Otherwise it's kind of a non-issue because you need  style.borderRadius  anyway for IE9 and Opera.
I searched and found only 1 bug report about this (bug 638911).