title: canvas taking more than 100% of the viewport
body: <p>I recently started to study Canvas but since I stumbled upon a problem I couldn't seem to solve : </p>
  
  <p>I simply tried to create a canvas that take the whole window, but as simple as it seems, i couldn't manage to get it right, it always take approximately 105% of both width and height of the window. </p>
  
  <p>here's the code : </p>
  
  <p>HTML : </p>
  
  <pre><code>&lt;head&gt;
  
      &lt;title&gt; Canvas Tests&lt;/title&gt;
      &lt;link href="css/style.css" rel="stylesheet" type="text/css"&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
      &lt;canvas&gt;&lt;/canvas&gt;
  &lt;/body&gt;
  &lt;script src="js/sketch.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>body,html{
      background : red;
      margin : 0;
  }
  
  
  canvas{
      background: blue;
      margin : 0;
  }
  </code></pre>
  
  <p>js</p>
  
  <pre><code>var canvas = document.querySelector("canvas");
  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;
  console.log(canvas.width,canvas.height);
  // output : 1536 759
  </code></pre>
  
  <p>I tried to replace the canvas tag by a div and set its width and height to 1536/759 and in that case it sizes properly.</p>
  
  <p>The problem occurs in both chrome and firefox, and seems to only occur when I try to size a canvas. Any help is appreciated </p>