Setting top and left CSS attributes

Question

I can't seem to get the "top" and "left" CSS attributes to work with the following JavaScript.

var div = document.createElement('div');
div.style.position = 'absolute';
div.style.top = 300;
div.style.left = 300;
document.body.appendChild(div);

I can see that the div's position is set to "absolute" in Firebug, but the top and left attributes are not!

This is a Firefox 3.6 add-on.

Answer 1

You can alternatively use the setProperty method, which is seen below.

document.getElementById('divName').style.setProperty("top", "100px");