How To Make Firefox Fullscreen Mode Like Chrome (i.e. Not Streching Content)

I am using the fullscreen API of modern browsers for my game application, Chrome works great in this respect and gives a window resize event that allows the resetting of the canvas

Solution 1:

Don't style the canvas, set it's width directly:

var elem = document.getElementById("canvas");
elem.width = size;
elem.height = size;

Changing the width and height of a canvas with CSS is supposed to distort it without changing the intrinsic size, just the same as with any other image.