What's your biggest current challenge? Have your say in Community Polls along the right column.

position: absolute doesn't work with new Shopify Order Printer

position: absolute doesn't work with new Shopify Order Printer

Talfo
Shopify Partner
8 0 2

With the newly released Shopify Order Printer, I would like to add a footer message to the bottom of the printed invoice.

So I added the following code at the beginning of the template:

 

<style>
  @media print {
    .footer-bottom {
      position: absolute;
      bottom: 0;
    }
  }
</style>

 

and at the bottom of the template:

 

<div class="footer-bottom">
  <hr>
  Footer message on the bottom of the page.
</div>

 

The code works with the previous version of Order Printer, but doesn't work with the new one.

The footer message is printed overlapping the body text.

"position: fixed; " instead of "absolute" may work, but the footer is also added to the packing slip that is subsequently printed, that's not intended...

 

Is there any idea to avoid the problem? 

Replies 0 (0)