Not Able To Set Page Number In Latest Chrome Browser Using Print Css

I am trying to print a invoice which goes over 2 pages and i want the page number to be displayed at the bottom while printing. It works fine on Firefox but chrome just prints page

Solution 1:

I found a way to do this in chrome using jquery somehow.

var bottom = 0;
$(document).ready(function() {
  $("table:nth-child(9n)").each(function() {
    bottom -= 5;
    botString = bottom.toString();
    var $counter = $('.footer.first').clone().removeClass('first');
    $counter.css("bottom", botString + "vh");
    ($counter).insertBefore('.insert');
  });
});

@charset"utf-8";
/* CSS Document */@page {
   size:8.27in11.69in; 
   margin: 0.5cm; 
}



body { font-family:"Courier New", Courier, monospace; line-height: 1.5;
	font-size: 11pt; }
.header { position:fixed; top:0; text-align:center; width:100%; margin: 0 auto; height:100px; bottom:1em; }

.page-layout {
        page-break-after: always; position: relative;
    width: 100%;
    top:2em;   //match size of headerleft:0px;
    right:0px;       
     
    }    
    body { counter-reset: page; }     
.footer {text-align:center; width:100%; margin:0 auto; position: absolute; }
.footer::after { top: 95vh; position: relative;
    white-space: nowrap; 
    z-index: 20px; width:100%;  margin:0 auto; text-align:center;
    counter-increment: page;
   content:"Page "counter(page);
}	
.inv-details {  }
.tstripe { border-top:2px dashed #000;} 
table {
	page-break-inside: avoid;
}

<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="footer first"></div><divclass="insert"></div><divclass="header">Commercial Invoice</div><divclass="page-layout"><tableclass="inv-details"width="100%"><tr><td>Invoice Number</td><td>Purpose of Shipment</td><td>Curr <br /> USD</td><td>Ult Dest. <br /> US </td></tr><tr><td>Export Dt <br /> 8/14/2017 </td><td>C.I. References </td><td>Pkgs <br /> 1 <br /> OTH </td><td>Bill T/C <br /> 1378-4267-0 </td></tr></table><tableclass="tstripe"width="100%"><tr><tdwidth="50%">Shipper: <br />
        VENNY PERSAUD <br />
        SBC INC, <br />
        130 MATHESON BLVD, E, <br />
        UNIT 1</td><tdwidth="50%">Consignee: <br />
        Marlon Browder <br />
        Marlon Browder <br />
        320 E GILLESPIE ST 
        </td></tr><tr><tdwidth="50%">MISSISSAUGE <br />
        ON L4Z1Y6 CA (866) 330-1272 <br />
        ID / EIN: </td><tdwidth="50%">STARKVILLE <br />
        MS 39759 US (622) 617-9890 <br />
        ID / EIN:
        </td></tr></table><tableclass="tstripe"width="100%"><tr><tdvalign="top"width="50%">
        	Broker <br />
            FedEx Ground's Broker
        </td><td>
        	Importer <br />
            VENNY PERSAUD <br />
            SBC INC, <br />
            130 MATHESON BLVD, E, <br />
            UNIT 1 <br />
            MISSISSAUGA <br />
            ON L4Z1Y6 CA (866) 330 - 1272 <br />
            ID / EIN: <br /></td></tr></table><!-- Item 1 --><tableclass="tstripe"width="100%"><tr><td>Part Nbr:</td><td>Marks / Nbrs: </td><td>Cntry MFG: US </td><td> Net Wgt: 0.00 lbs</td></tr></table><tablewidth="100%"><tr><td>HS Code: 9503.90 </td><td>Unit Qty: 1.00 PCS </td><td>Unit Value: 5.600000</td><td>Commodity Value: 5.60 </td></tr><tr><tdcolspan="4">
            Desc: Foil Ballon
        </td></tr></table><!-- Item 2 --><tableclass="tstripe"width="100%"><tr><td>Part Nbr:</td><td>Marks / Nbrs: </td><td>Cntry MFG: US </td><td> Net Wgt: 0.00 lbs</td></tr></table><tablewidth="100%"><tr><td>HS Code: 9503.90 </td><td>Unit Qty: 1.00 PCS </td><td>Unit Value: 5.600000</td><td>Commodity Value: 5.60 </td></tr><tr><tdcolspan="4">
        	Desc: Foil Ballon
        </td></tr></table><!-- Item 3 --><tableclass="tstripe"width="100%"><tr><td>Part Nbr:</td><td>Marks / Nbrs: </td><td>Cntry MFG: US </td><td> Net Wgt: 0.00 lbs</td></tr></table><tablewidth="100%"><tr><td>HS Code: 9503.90 </td><td>Unit Qty: 1.00 PCS </td><td>Unit Value: 5.600000</td><td>Commodity Value: 5.60 </td></tr><tr><tdcolspan="4">
            Desc: Foil Ballon
        </td></tr></table><!-- Item 4 --><tableclass="tstripe"width="100%"><tr><td>Part Nbr:</td><td>Marks / Nbrs: </td><td>Cntry MFG: US </td><td> Net Wgt: 0.00 lbs</td></tr></table><tablewidth="100%"><tr><td>HS Code: 9503.90 </td><td>Unit Qty: 1.00 PCS </td><td>Unit Value: 5.600000</td><td>Commodity Value: 5.60 </td></tr><tr><tdcolspan="4">
            Desc: Foil Ballon
        </td></tr></table><!-- Item 5 --><tableclass="tstripe"width="100%"><tr><td>Part Nbr:</td><td>Marks / Nbrs: </td><td>Cntry MFG: US </td><td> Net Wgt: 0.00 lbs</td></tr></table><tablewidth="100%"><tr><td>HS Code: 9503.90 </td><td>Unit Qty: 1.00 PCS </td><td>Unit Value: 5.600000</td><td>Commodity Value: 5.60 </td></tr><tr><tdcolspan="4">
            Desc: Foil Ballon
        </td></tr></table><!-- Item 6 --><tableclass="tstripe"width="100%"><tr><td>Part Nbr:</td><td>Marks / Nbrs: </td><td>Cntry MFG: US </td><td> Net Wgt: 0.00 lbs</td></tr></table><tablewidth="100%"><tr><td>HS Code: 9503.90 </td><td>Unit Qty: 1.00 PCS </td><td>Unit Value: 5.600000</td><td>Commodity Value: 5.60 </td></tr><tr><tdcolspan="4">
            Desc: Foil Ballon
        </td></tr></table><!-- Total --><tableclass="tstripe"width="100%"style="margin-top:30px;"><tr><tdalign="right">Total Shipment Weight::</td><td>1</td><tdalign="right">Total Commodity </td><tdalign="right">29.12</td></tr><tr><tdalign="right"colspan="3">Terms of Sale:</td><tdalign="right">FCA</td></tr><tr><tdalign="right"colspan="3">Freight:</td><tdalign="right">0.00</td></tr><tr><tdalign="right"colspan="3">Insurance:</td><tdalign="right">0.00</td></tr><tr><tdalign="right"colspan="3">Others:</td><tdalign="right">0.00</td></tr><tr><tdalign="right"colspan="3">Total Invoice Value:</td><tdalign="right">29.12</td></tr></table><table><tr><td>	Comments</td></tr><tr><td>1)  </td></tr><tr><td>2) </td></tr><tr><td>3) </td></tr><tr><td>Tracking Numbers: 738443302589 </td></tr><tr><td>I declare all information in this invoice to be true and correct. </td></tr><tr><td>Signature of shipper: VENNY PERSAUD <spanstyle="float:right;">8/14/2017</span></td></tr></table></div>