YUI3 (JS) setStyle using vendor prefixes

Question

How do I use YUI3's set style to set something like -webkit-border-radius: 10px;?

example:

Y.one('#mydiv').setStyle('-webkit-border-radius', '10');

Answer 1

Should work.

I think you are missing the 'px' for

Y.one('#mydiv').setStyle('-webkit-border-radius', '10');

Should be

Y.one('#mydiv').setStyle('-webkit-border-radius', '10px');

Answer 2

Use camel case. When DOM scripting, style properties should always be set using camelCase. Webkit is lax about that and violates spec.

Y.one('#mydiv').getDOMNode().style.setProperty('mozBorderRadius', '10');

For border-radius, it's pretty safe (these days) to skip the vendor prefix, though.

Source

Answer 3

In case anyone else still needs to accomplish this, here's how I did it:

Y.one('#mydiv').getDOMNode().style.setProperty('-moz-border-radius', '10');