As a security precaution, we have turned on the setting "Require API key authentication for API requests" for everyone. If this has broken something, please contact bugzilla-admin@mozilla.org
Last Comment Bug 694885 - CSS border-radius can't be set from JavaScript element.style.MozBorderRadius
: CSS border-radius can't be set from JavaScript element.style.MozBorderRadius
Status: RESOLVED INVALID
:
Product: Core
Classification: Components
Component: CSS Parsing and Computation (show other bugs)
: unspecified
: All All
: -- normal (vote)
: ---
Assigned To: Nobody; OK to take it and work on it
:
: Jet Villegas (:jet)
Mentors:
Depends on:
Blocks:
  Show dependency treegraph
 
Reported: 2011-10-16 16:14 PDT by rochal
Modified: 2011-10-17 05:37 PDT (History)
1 user (show)
See Also:
Crash Signature:
(edit)
QA Whiteboard:
Iteration: ---
Points: ---
Has Regression Range: ---
Has STR: ---


Attachments
wrong, use the next one (425 bytes, text/html)
2011-10-16 17:39 PDT, j.j.
no flags Details
testcase (this time the right one, sorry) (442 bytes, text/html)
2011-10-16 17:41 PDT, j.j.
no flags Details

Description User image rochal 2011-10-16 16:14:51 PDT
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 User image j.j. 2011-10-16 17:03:57 PDT
> 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 User image j.j. 2011-10-16 17:24:27 PDT
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 User image j.j. 2011-10-16 17:39:53 PDT
Created attachment 567371 [details]
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 User image j.j. 2011-10-16 17:41:41 PDT
Created attachment 567372 [details]
testcase (this time the right one, sorry)
Comment 5 User image rochal 2011-10-17 01:31:14 PDT
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 User image j.j. 2011-10-17 05:37:38 PDT
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).

Note You need to log in before you can comment on or make changes to this bug.