Order Printer Overlapping Text When Printing Multiple Orders

Order Printer Overlapping Text When Printing Multiple Orders

MakP
Shopify Partner
33 9 14

I'm trying to get the order name and order date to print at the bottom right of the page.

 

I have some html/css set up for this:

 

 

<div style="position:fixed;bottom:0;right:0"> <!--- Bottom order date and order number --->
		<span style="margin-top:0;margin-bottom:3px;font-size:12px">{{ date | date: "%m/%d/%Y" }} - </span>
		<span style="margin-top:0;margin-bottom:3px;font-size:16px;font-weight:bold">{{ order_name | remove: "#" }}</span>
</div>

 

 

This works fine when printing one order - The text shows up at the bottom right as expected.

 

When printing multiple orders, the numbers from every order selected will overlap and reprint on every page.

image.png

 

Additionally, the order preview page shows my "footer" text at the extreme bottom right corner of the screen:

Look at bottom right hand side of screen.Look at bottom right hand side of screen.

I have no idea how to resolve this, but anything to do with a "position:fixed" css attribute seems to overlap (I've done testing with other templates).

 

I have tried various workarounds to using position:fixed css and none seem to be able to accomplish what I am wanting without introducing other unintended issues.

Replies 0 (0)