title: Is there something I am doing wrong by trying to make a rectangle?
body: <p>I am trying to make a rectangle by filling it with html/javascript, but for some reason, even though it's only a few lines of code, I can't figure out what I'm doing wrong here</p>
  
  <p>I've already tried in the code using strokeStyle and not using the viewport , I also tried using  <code>var canvas = document.getElementById("myCanvas");</code>  like this, with double quotes</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var canvas = document.getElementById('myCanvas');
  var ctx = canvas.getContext("2d");
  
  ctx.fillStyle = "rgb(255, 255, 255)";
  ctx.fillRect(0, 0, 40, 40);</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;canvas id="myCanvas" style="border: 1px solid black; height: 50px; width: 100vw; max-width: 100%;"&gt;&lt;/canvas&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I truly don't know anymore what I'm doing wrong and I just want to make a rectangle</p>