Comments (9)
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.
Related Issues (20)
- Page sizes off by one mm? HOT 4
- detect the size of paper
- Firefox adds a blank page on printing-only for Firefox HOT 1
- Lengthy html elements are getting cut off HOT 2
- Bottom shadow doesn't display right on iOS
- Can we generate the page number dynamically? HOT 2
- Any one know why this not work in iPad?
- How to add F4 paper size? HOT 8
- Print size problem HOT 4
- How to include a footer respecting left and right padding? HOT 1
- Do i need to credit the author in my work? HOT 1
- How to print two A4 paper in A3 Landscape? HOT 1
- How to add page numbers
- Is this abandoned? HOT 1
- Are these lines still needed?
- When printing. It always adds an extra page. HOT 4
- Use css class instead apply to body element directly
- Accounting for different DPI (ie 72 vs 96)
- Request: Multiple pages with different sizes and orientations HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from paper-css.