canvas translate

CSS

canvas { 
    background: #eee; 
}

JavaScript

var canvas = document.createElement('canvas');
canvas.width = 400;
canvas.height = canvas.width;

canvas.style.boxShadow = '0 -' + canvas.height/2 + 'px #ccc inset, 0 ' + canvas.height/2 + 'px #ddd inset';

document.body.appendChild(canvas);

var ctx = canvas.getContext('2d');

ctx.scale(canvas.width/200, -canvas.height/200);
ctx.translate(400, -201);

ctx.fillStyle = 'black';
ctx.fillRect(0,0,.5,.5);

ctx.fillStyle = 'red';
ctx.fillRect(.5,.5,.5,.5);