How can i resize my canvas to fit the browser window?

Hello :) i am currently trying to resize my canvas whenever someone resizes their browser window. Here is my code so far:

html:

 <html>
 <head>
  <meta charset="UTF-8">
 <script language="javascript" type="text/javascript" src="libraries/p5.js">
 </script>
<script language="javascript" src="libraries/p5.dom.js"></script>
<script language="javascript" type="text/javascript" src="sketch.js">
 </script>
 <script language="javascript" type="text/javascript" src="blob.js">
 </script>
 <title>USGame</title>
 <style>
    html, body {
        width: 100%;
        height: 100%;
        margin: 0px;
        border: 0;
        overflow: hidden; /*  Disable scrollbars */
        display: block;  /* No floating content on sides */
    }
</style>
</head>

<body>
</body>
</html>

and here is my js file:

  var blob;

 var blobs = [];
 var zoom = 1;

function setup() {
 createCanvas(1500, 600);
blob = new Blob(0, 0, 64);
for (var i = 0; i <100; i++) {
var x = random(-width,width);
var y = random(-height,height);
 blobs[i] = new Blob(x, y, 8);
  }
}

function draw() {
 background(3, 3, 40);

 translate(width/2, height/2);
 var newzoom = 64 / blob.r;
 zoom = lerp(zoom, newzoom, 0.1);
 scale(zoom);
 translate(-blob.pos.x, -blob.pos.y);

 for (var i = blobs.length-1; i >=0; i--) {
 blobs[i].show();
  if (blob.eats(blobs[i])) {
  blobs.splice(i, 1);
  }
 }


 blob.show();
 blob.update();

 }

where it says: createCanvas(1500, 600); i am setting the fixed width and height, when i really want these to adjust to fit someone's browser window. Please explain how i can do this! Thank you!