html to pdf not same in jsPDF javascript

I have a html page, converting to PDF in button click, But it does not remain same when downloading, How to set width and height fit in jspdf javascript.

when the inspector is open/screen resize the pdf width height is not fit to screen

convertPDF = () => {
  html2canvas(document.querySelector("#content")).then(canvas => {
     var imgData = canvas.toDataURL("image/png",1);
     var pdf = new jsPDF("p", "pt", "letter");
     var pageWidth = pdf.internal.pageSize.getWidth();
     var pageHeight = pdf.internal.pageSize.getHeight();
     var imageWidth = canvas.width;
     var imageHeight = canvas.height;
     var ratio = imageWidth/imageHeight >= pageWidth/pageHeight ? pageWidth/imageWidth : pageHeight/imageHeight;
     pdf.addImage(imgData, 'JPEG', 0, 0, imageWidth*ratio, imageHeight*ratio);
     pdf.save("sample.pdf");
  });
}