HTML to PDF distorting pixel size

Viewed 392

Consider this HTML code:

<html>
    <body>
        <div style="height:300px; width:300px; border: 2px solid black;">
        </div>
    </body>
</html>

In a browser this displays as a perfect square. If I place this code in a HTML file and convert the file to PDF, the div will actually have extra pixels added to its height. This is most visible width the naked eye at a smaller size like 40 px, but can be tested at any size with graphics software.

I don't understand what's going on. Does the PDF conversion, the file format, or the PDF viewers distort the pixels into rectangles? Does the PDF conversion interpret the div as always having a minimum height, to which it then adds your height property?

1 Answers

Use metric units of 'cm' or 'mm' instead of pixels (px).

Related