8
votes

I am wanting to print labels from a Brother Label Printer from a web browser. I know DYMO has a JavaScript framework that makes printing from the browser simple. But I have customers with a Brother label printer so I need to make it work.

I've been doing some testing and some searching and it's surprising how little information is out there on this subject.

So far the only browser I have had success with is Google Chrome as it doesn't seem to print header and footers. I have installed the printer/drivers and created a custom a custom paper size which measures 62 x 29mm.

Custom Paper Size

When I try to print, it's splitting the text over 5 labels. I have the following text on the page I am trying to print:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Print</title>
</head>
<body>

<p style="margin: 0; padding: 0; line-height: 13px; font-size: 11px; font-family: Arial; font-weight: normal; border: 1px solid #000;">Line 1<br />
Line 2</p>

</body>
</html>

But it prints 5 pages as you can see from the print que sample.

Custom Paper Size

Has anyone tackled this before or have any suggestions.


UPDATE

After changing the the margins listed in the first screenshot above to 0, it got it down to two pages. But there's still a huge margin around it:

2 Pages

1

1 Answers

3
votes

This answer won't solve your problem in 100%. I've tested it against Safari with custom paper settings - same as ones from your example. I was testing it against printing to PDF so maybe with specific printer driver it will behave a bit different. Your example CSS and HTML are missing margin and padding reset. Here is example for @media print:

@media print {
    body, html, p {
        margin: 0pt !important;
        padding: 0pt !important;
    }
    @page {
       margin: 0pt !important;
       padding: 0pt !important;
    }
}

With this settings 2 lines of text are on one page, hover there is still some margin that can't be reduced to 0.