Whenever I try to print a div from the webpage, the elements of the div end up on the side of the print tab instead. How can I fix this issue?
Below is my current print function:
print(): void {
let printContents, popupWin;
printContents = document.getElementById('print-section').innerHTML;
popupWin = window.open('', '_blank');
popupWin.document.open();
popupWin.document.write(`
<html>
<head>
<title></title>
<style>
</style>
</head>
<body onload="window.print();window.close()">${printContents}</body>
</html>`
);
popupWin.document.close();
}
I've heard that using CSS might solve this problem. Where should I add the CSS code? I've tried including it in the style tag but it doesn't seem to work.