loading...

How can I set HTML width/height properties to a CSS value?

calin92540842 profile image PDS OWNER CALIN (Calin Baenen) ・1 min read

So, when I make canvases, I like to set their width/height in CSS, because you can use screen relative units vw, vh, %, etc..., but only setting the w/h with CSS isn't a good practice, as it only seems to resize the canvas visually (at least for me) and doesn't update it's resolution.
But when I try

<canvas width="10vw" height="10vh"></canvas>

it doesn't work (presumably because those aren't valid values). So how can I set the w/h both visually and contextually for the canvas in html?

Thank you all for reading.
Cheers.

Discussion

markdown guide
 

Probably you can wrap your canvas to div with vh/vw sizes and set canvas height 100% and width 100%. I guess it should work 😁

 

but that's css, as far as I'm aware:

<htmlElement width="10vw" height="10vh">

isn't fully valid. Could you please show what you were thinking in a codeblock? Thanks. Cheers.