HTML CSS Page Break not functioning when printing via Shopify Android App

I am creating a template to print labels of the items ordered on a shopify order.

I have set it up where every label is separated on different pages with the use of Page Breaks so that they will be automatically printed on separate labels using a thermal printer.

On PC and Shopify on google chrome Mobile the labels are separated on different pages as planned, but on the Shopify App on Android, the page break doesn't seem to be in effect as only 1 page is appearing on the printing dialog.

This is the Shopify App Print Dialog where it is only giving me 1 Page Shopify App Print Dialog (https://i.stack.imgur.com/OEarP.jpg)

This is the Shopify Print Dialog when I use Shopify on Google Chrome Mobile Browser Shopify Web Browser Print Dialog (https://i.stack.imgur.com/nAgEh.jpg)

This is the simple code I am using for the Page breaks

 @media print {
.pagebreak { page-break-before: right; }

          }
Copy code

At the end of each loop where a label is created, a page break is done.

I apologize if I am asking the question incorrectly, this is my first time and I am quite a novice when it comes to coding. Thanks for any help that you can give.

Didn't find the answer?

Our community is visited by hundreds of Shopify development professionals every day. Ask your question and get a quick answer for free.