WookieCoder WookieCoder - 5 months ago 16
CSS Question

Stretch canvas in browser but maintain inner dimensions

I have recently been creating a game using a

as my game display. It is a 2d tile-based game (think final fantasy) using tiles that are 32px x 32px. I have no issue drawing the tiled content, however currently my canvas is constrained to specific proportions, which makes the interface look bad. Is there any way to maintain the size of the canvas contents, while stretching the canvas container? For instance, i'd like to draw 672px x 672px inside the canvas, then have the canvas follow the style
height: 50vh; width: 50vh;

<canvas width="64" height="64" style="width:672px;height:672px"></canvas>