Adobe AIR canvas dimensions messed up

Question

I'm messing about with Canvas in Adobe Air. But their seems to be some issue with the mouse coordinates. The more I click towards the right, the difference between the draw position and actual click increases. My code is

Wb.canvas.fillRect(evt.clientX-canvasTag.clientX, evt.clientY-canvasTag.clientY, 50, 50);

Answer 1

If you are clicking on canvas then you should just use localX and localY like this:

Wb.canvas.fillRect(evt.localX, evt.localY, 50, 50);

Answer 2

After a lot of messing around, it's fixed. canvas width and height should be set as html attributes and not in the stylesheet. Then it works perfectly.

Correct:

<canvas id="myCanvas" width="600" height="400"></canvas>

Incorrect:

<canvas id="myCanvas" style="width:600px;height:400px"></canvas>