Lona HTML5 em camadas e centralizada? - html, css, html5, css3, tela

Como eu iria usar HTML5"s tela de pintura fazer mulitple camadas de tela ontop um do outro, enquanto estão centralizados corretamente na página (via CSS3) Eu pareço estar tendo problemas para obter as duas etapas para trabalhar corretamente. Alguma sugestão?

Respostas:

O que eu sugiro é ter todos os seus canvas tags contidas em um único div como tal:

<div id="canvasHold">
<canvas id="canvas1"></canvas>
<canvas id="canvas2"></canvas>
<canvas id="canvas3"></canvas>
</div>

E o CSS correspondente ao centro:

#canvasHold {
position: absolute;
top: 50%;
left: 50%;
width: 800px;
height: 600px;
margin-left: -400px; /* Negative half of the width */
margin-top: -300px; /* Negative half of the height */
}

#canvasHold canvas {
width: 100%;
height: 100%;
}

Claro, definir a altura de um elemento de tela em CSS é não o mesmo que definir a altura e largura como atributos HTML de cada tag de tela. Não faria mal para configurá-los para 100% em CSS, mas você deve defini-los como atributos HTML.