Rows not properly aligned with L4731 !?

[jdelker]

Thanks @tmaier for this surpisingly simple but highly effective method to print ASN labels! Please don't get offended by the title. I'm quite confident, that you have testet this, but it doesn't work here and I would like to get to the bottom of it ;)

When I startet to print the first labels (on Avery L4731 forms), I encountered a missalignment of the rows. The first label in a row matched, but each succeeding label lacked a tiny bit, adding up to approx 2-3mm offset on the last label in the row. The spacing on the vertical rows looked good, though.

At first, I suspected the printer driver (Brother) - and in fact #1 indicates, that there may be issues - but besides some eventually required adjustments of page margins, I could not find any (scaling) problem with the driver. To rule that component out, I let Chrome print directly to PDF (not via the printer driver!) to be able to verify what is actually generated. I used the rulers and helper lines of "PDF Xchange Viewer" to exactly measure the placements of the elements in the PDF - and somehwat surprisingly they matched my manual measurements of the printout!

Ok, given that, I now dived into your HTML/CSS code. While I'm certainly no expert in that matter, I tried to follow the formating directions: (Please correct me, if I got something wrong)

• Each element is 25.4mm wide ( w-[25.4mm])
• Between each element is a gap of 2.5mm (gap-x-[2.5mm])
• Calculating the distance from the left edge of the first to the last element would then by 6 25.4 + 6 2.5 = 167.4mm.

All that matches my measurements of the Avery L4731 form! So all good there, obviously.

Now, if I perform the same measurements on the generated PDF, I got this:

• The distance between the left edge of first and last element is only ~165mm
• The difference accounts exactly for the offset-skew seen on the printouts.

I would conclude that there is some rendering issue of the page in Chrome!? I've attached the generated PDF for your reference. asn_orig-tmaier.pdf

Any thoughts welcome.

[touraner]

Did the same experience today on my MAC. Maybe it works different on Windows?

[tmaier]

I am working on Mac. I had a very very small deviation on the last box and I accounted this on my printer for inaccuracy of the printer. So the Mac is not the issue.

lets do one thing to de-bug it: download the word file from https://www.avery.co.uk/template-l4731

This menu give you the size information.

You will see that WIDTHxHIGH is 2,54 cm X 1 cm You will see that the margin between two boxes is 0,25 cm (see 3,64-(0,85+2,54) for the first two boxes)

This are the numbers we are using here in the code:

I re-read now how how the box model works at https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/The_box_model

and essentially it is width + padding + border, not just width. This means, I will change this now, so that padding and border does not affect it anymore. I hope this helps.

I would ask you to re-check the vertical positioning of the boxes

[tmaier]

I updated now https://tobiasmaier.info/asn-qr-code-label-generator/

Please review this

[jdelker]

Vertical alignment is ok. Horizontal alignment is still off. The total distance between first and last element (each left edge) still does not add up to 167,4mm. (625,4+62,5) but is more like 166mm.

asn_orig-tmaier2.pdf

[TimberlAndRE-de]

I have the same problem, the horizontal alignment is (now) off for me too. It worked until last print out. The alignment wasn't perfectly centered inside each sticker but it was ok. but today I wanted to print the next sheet with the next 186 numbers but now the prints in the two right columns of stickers are all off the sticker borders for at least 1mm... I guess something was changed in the past weeks?

[TimberlAndRE-de]

I tried older versions of your tool now and it's still off So it seems the change wasn't in your tool but in the browser (or the way it renders the css/html) maybe?

here's an example of my print out:

[jdelker]

lets do one thing to de-bug it: download the word file from https://www.avery.co.uk/template-l4731

FYI: If I print that template, the fields align perfectly with the Avery L4731 form. So it's obviously no issue with the printer driver, but the rendering of the browser.

[jdelker]

I believe to have found the problem and the cure. See my PR #5.

[TimberlAndRE-de]

Yay !! this works perfectly!

It's working with the commit version you mentioned (not with the latest version) and your changes

Thank you so much!

[tmaier]

I merged the changes of #5. And I am going to close this issue. Please re-open, if the problem persists