HTML attributes (width, height) change canvas independently

Question

I have several script in JS, this is changing the width and height of the canvas element:

 function RefreshSizes (canvas) {
        var temp_width = 320;
        var temp_height = 240;

        document.getElementById(canvas).setAttribute('width', temp_width);
        document.getElementById(canvas).setAttribute('height', temp_height);
    }

these functions are called immediately after the initialization of the canvas. It works fine in Chrome.

But in FireFox 49, I see that:

What could it be?

UPD # 1 Tested BukkitmanPlays MCPE Code

UPD # 2 Full CSS for the canvas:

    element {
        width: 320px;
        height: 240px;
    }
    .canvas {
        border: 3px solid #E0E0E0;
        z-index: 0;
        position: relative;
    }
    html {
        font: 10px/10px arial;
    }

Answer 1

some code in one browser does not match with another browser, so in this case I would do:

function RefreshSizes (canv) {
    var temp_width = 320;
    var temp_height = 240;

    var canvas = canv;
    canvas.width = temp_width;
    canvas.height = temp_height;
}

I'm sure it will work