Search code examples
javascripthtmlcssheightwidth

How to set width and height of canvas to all height and width of browser without overflow?

I want to make a canvas with width and height of document without scrolls, but I don't know how to do this. I tried:

canvas.width = window.innerWidth;
canvas.width = parseInt(getComputedStyle( document.body ).getPropertyValue( 'width' ));
canvas.width = document.body.offsetWidth
canvas.width = document.body.clientWidth

But I got 1-20 unused pixels that I can scroll, also I can't reduce width and height by fixed number of pixels - different browsers show it differently.

Solution

  • Fixed by "display: block", canvas elements aren't blocks by default.