How do I set width and positioning of an object with javascript from a variable?

Question

I am trying to create a button in javascript and make that button positioned below a canvas, the same width as the canvas, however, I don't seem to be able to set the top and width as a variable (the code is ignored). Here is my code: (problem lines commented)

var myButton = document.createElement('button');
myButton.style.position = 'absolute';
myButton.style.left = '0px';
myButton.style.top = canvasHeight; //
myButton.style.width = canvasWidth; //
myButton.style.height = '100px';
myButton.innerHTML = 'Restart!';
document.body.appendChild(myButton);

Note that the canvas is resizable, so I can't just type in a px value.

Answer 1

Here's my comment in an answer:

Make sure you have the correct format in canvasHeight and canvasWidth , eg "100px" rather than just "100".