Solution 1 :

How about

@media print {
     body {
        margin: -2rem 0 0 0;

Problem :

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]

        @media print
         @page {
           margin-top: 0;
           margin-bottom: 0;
         #div_print  {
           padding-top: 0px;
           padding-bottom: 0px ;
    <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;
            document.body.innerHTML = oldstr;
            return false;
    <title>div print</title>

    <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>





Comment posted by Scott Marcus

Have you tried setting

Comment posted by jack

yes i used it. but it didn’t work. same space is comming. @scott Marcus

Comment posted by jack

thankyou @jkarttunen. i tried it. but still the top space is comming. i don’t know what happen exactly.

Comment posted by Jkarttunen

Try negative top margin next?