Firefox adds a blank page on printing - even with single empty page about paper-css HOT 9 OPEN

Chrome seemed to be fine, but was having issues in Safari. This is how I fixed it. It didn't seem to cause any regression in Chrome.

@media print {
   .sheet {
      /* firefox, safari extra page fix */
      width: 100% !important;
      height: 100% !important;
      page-break-after: auto !important;
   }
}

from paper-css.

I have same problem on safari (platform is Mac OS).
I fixed it like this. I think this solution is temporary fix.

.paper__sheet
  @extend .sheet
  @media print
    width: 100% !important
    height: 100% !important

I think we don't need width, height in printing mode.

from paper-css.

Hi just found this issue in Chrome.
How to fix?

from paper-css.

Hi, @janvydra
Pls, forget everything about IE...
By the way, Firefox and Edge seems OK in my environment.

Check this example:
https://github.com/cognitom/paper-css/blob/master/examples/a4.html

You can check the same file from this URL directly:
https://raw.githack.com/cognitom/paper-css/master/examples/a4.html

Open the URL above on Firefox and Edge. You may also need to check the orientation of papers and stuff.

from paper-css.

I have the exact same problem with Safari (last version). Even with your direct example.

from paper-css.

Same problem only on widnows+firefox using 'Adobe PDF' or 'PDF Pro Virtual Printer' as output.
Run well on linux...
Chome is ok on all platforms.

from paper-css.

I am experiencing the same thing, a blank page is added after every page in FireFox, but only when printing, not when viewing in browser. (on Windows platform)

It seems to work in Chrome.

from paper-css.

I have found that reducing the paper size by 0.4mm (from 296mm to 295.6mm) will fix the issue in Firefox (Linux).
body.A4 .sheet { width: 210mm; height: 295.6mm }

@bompus fix also eliminates the extra pages but it also causes the content on the next sheet to flow over the unused space of the sheet before it.

from paper-css.

Try putting style="contain: size;" or style="contain: strict;" around the parent element

from paper-css.