The problem is that in Chrome this page is saved as PDF correctly on one computer and has problems with another. I have this code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> body { margin:0; padding:0; } .fullscreen { width:1156px; height:893px; float:left; background:url(2.jpg) no-repeat; } .firstpage{background:url(1.jpg) no-repeat;} .lastpage{background:url(3.jpg) no-repeat;} @media print { body { width:1156; height:893; } } </style> </head> <body> <div class="fullscreen firstpage"></div> <div class="fullscreen"></div> <div class="fullscreen lastpage"></div> </body> </html>
These are just 3 divs with 3 different background images (same size - 1156x893). Everything is fine on my home computer. There is no difference if I place @page {size: 1156 893;} or size: auto or (as in this case), I do not place it at all.
The problem is on my office computer, where no matter what I do, the page size in print mode is always 1286x909, and the content scales and extends beyond the page. Am I missing something, or is the problem not in the page code? And if it's not in the code, where do I need to change something to do everything right? If necessary, I can also provide 2 PDF files.
I am using Windows 7 with the latest version of Chrome on both computers.
source share