I\'m working on print friendly css for a website. It previews/prints perfectly in IE, but Firefox (version 3.6) only previews/prints the 1st page.
Is anyone aware of
I tried adding @media print
as suggested in this answer as a style
definition to the page's <body>
element, but Firefox (60.0 (64-bit), Windows 7 64/Pro) still truncated printout of the website to the first page only.
Then I happened to notice a checkbox entitled Simplify Page at the top of Firefox's Print Preview screen:
When I checked this box, Firefox removed some of the styling, but the Print Preview screen refreshed to include all of the pages in the website!
I'm not sure how broadly applicable this is so YMMV, but it's worth a try! So far I haven't found a comparable solution for Chrome (Version 65.0.3325.162 (Official Build) (64-bit)).
P.S.: on further experience I see that Simplify Page removes not only styling but also some entire elements such as sample code sections, so be sure to review the results carefully before printing.
I tried a dozen fixes for this and, in the end, all I needed was:
@media print {
body {
display: block;
}
}
for me (bootstrap 4) solution was
@media print {
.row {
display: block;
}
}
I had the same issue and I replaced position from position:relative
to position: absolute
with height: 100%
from the top div to the bottom.
The long-standing bug with printing absolutely-positioned elements was fixed in Firefox 3.
The issues with missing pages are tracked in bug 521204 (look through the "depends on" list). Do you have frames or long tables on the page you're trying to print?
And yes, printing in Firefox is under-owned, sorry you have to deal with it...
I was having the same issue. Turns out, the root tag had display: flex
on it. After changing this to display: block
, the rest of the content was displayed. I'd recommend going up your DOM tree and checking every display
attribute.