4

I have a little issue if I print images with Chrome or Firefox. I haven't found how to get rid of white borders in portrait or landscape. This stackoverflow-solution seems to not works for me sadly.

Currently I use this code: 

    echo "<body onload=\"window.print()\" onfocus=\"window.close()\">";

    echo "<style type=\"text/css\" media=\"print\">";
    echo "@page { size: auto; }";
    echo "</style>";

    echo "<img src=\"". $dirname . '/' . $photo ."\">";

I get the same result as drag and drop it from windows folder to internet navigator like this exemple:

Chrome is set as: - Landscape - Colors - A4 - Marges none

bug

Community
  • 1
  • 1
BackTrack57
  • 395
  • 1
  • 5
  • 16

2 Answers2

11

try to apply the container css : 

@page {
  size: A4;
  margin: 0;
}
@media print {
  html, body {
    width: 210mm;
    height: 297mm;
  }
}

then instead of using img tag use background image + size cover

body {
    background-image:  url(images/background.svg);
    background-size:   cover;                      /* <------ */
    background-repeat: no-repeat;
    background-position: center center;            /* optionally, center the image */
}

source:

Community
  • 1
  • 1
Jeffrey Nicholson Carré
  • 2,950
  • 1
  • 26
  • 44
0

Your image file probably has different dimensions than the paper size, so unless you want to stretch the image to fill the page, or use something like background-size: cover; there will always be a margin

Grzegorz Palian
  • 300
  • 2
  • 9