i am developing a small code for receipt printing using html, JavaScript and css. i am printing a certain div only in my page. but when i print in receipt the top having some space. i want to remove that space.
so here some codes i was tried but i don't know can i reduce or remove that.
so anyone help on this!!!
[![this is my printed receipt sample. i was marked which space i want to remove in that ][1]][1]
<head>
<style>
@media print
{
@page {
margin-top: 0;
margin-bottom: 0;
}
#div_print {
padding-top: 0px;
padding-bottom: 0px ;
}
}
</style>
<script language="javascript">
function printdiv(div_print) {
var headstr = "<html><head><title></title></head><body>";
var footstr = "</body>";
var newstr = document.all.item(div_print).innerHTML;
var oldstr = document.body.innerHTML;
document.body.innerHTML = headstr + newstr + footstr;
window.print();
document.body.innerHTML = oldstr;
return false;
}
</script>
<title>div print</title>
</head>
<body>
<input name="b_print" type="button" class="ipt" onClick="printdiv('div_print');" value=" Print ">
<div id="div_print">
<h1 style="Color:Red">The Div content which you want to print</h1>
</div>
</body>
</html>```
[1]: https://i.stack.imgur.com/aCb6w.jpg
How about