Q:

HTML Canvas scales along x axis? (Using Internet Explorer)

I am drawing on a canvas object using JavaScript and somehow Internet Explorer (don't ask, I have to), Version 11 scales the drawings along the x axis.
Here is the JavaScript code:
var c = document.getElementById('canvas1');
var ctx = c.getContext('2d');
ctx.beginPath();
ctx.arc(50, 50, 50, 0, 2 * Math.PI);
ctx.fillStyle = '#000000';
ctx.lineWidth = 5;
ctx.stroke();

You would expect a circle to appear. But instead I get an Ellipse:

(Don't mind the horizontal line on the left, that just the surrounding div. The canvas is the small square.)
EDIT: The size of the canvas is 100 x 100.

A:

Following the comments the answer is to set height and width of the canvas object as attributes of the canvas-tag. Like this:
<canvas height="200" width="400"></canvas>

See this post for further explanation.

