Trouble combining CSS and JS Objects

For a page I'm writing, when I call a new object, a document.write() line is called in which it writes html/css tags to bring a picture corresponding to that object on the page. The problem is it won't let me change the properties that I normally could, such as .top or .left, etc.

For example, when I make the object "chef" there is a line:

document.write("<div id='chefDiv' style='position:absolute; top:"+this.y+"; left:"+this.x+"; z-index:2'><img src="+this.src+" name='chefbmp'></div>");

Then, in a totally different area of the code I try:

document.getElementById('chefDiv').style.top = 200;

... and the location of the chefDiv does not change. However if I try the code:

alert(document.getElementById('chefDiv').style.top);

... it will bring an alert message that says "407px".

What am I doing wrong here? Is there something different about this because I'm using objects and constructors? Or is it because I'm using document.write(....) instead of directly writing the html in the page?

How can I change the aspects of my chefDiv?

Thanks!
Kevin

Try changing it to document.getElementById('chefDiv').style.top = "200px"