print stylesheet, one page prints and cuts off remaining text

Question

I\'m working on a printable list of events, the printer prints one page fine, but cuts off some of the text on the bottom, then it print a second blank page

I\'ve tr

Answer 1

just setting display: inline solved my same problem.

Reference link I got, https://www.bennadel.com/blog/851-fixing-divs-that-cause-content-truncation-when-printing.htm

Answer 2

In print.css, set overflow: visible instead of overflow: auto on div#content. That fixed it for me in Firefox at least. The definition of overflow auto is: "If overflow is clipped, a scroll-bar should be added to see the rest of the content" -- but scroll bars don't exist on printed pages.

I'm guessing that since the content div should span across multiple pages, the browser thinks "you're flowing outside your container and must be clipped with a scroll bar". The container in that case is the first page the content div appears on.

Answer 3

if overflow:visible; not works, try overflow-y:visible;

(i had body{overflow-y:scroll;}, and body{overflow:visible;} in print.css not rewrited it...)

Answer 4

for me, the issue was this meta tag:

<meta name="viewport" content="width=device-width, initial-scale=1"/>

which putting any value other than 1 for initial scale solves my problem:

<meta name="viewport" content="width=device-width, initial-scale=0.8"/>

Answer 5

I found that setting display: inline on container divs also helped. Some of these great answers here have worked for me in certain situations while in others no.

<div class="container">
    <div class="content-cutting-off-here">
        Some long text that gets cut off at the end of the page...
    </div>
</div>

Most people set containers to display block or inline-block. For me it was cutting off text, and setting it to inline circumvented that. This also makes width and height irrelevant for the offending container div; which I have found to be a nuisance when printing.

@media print {
    .container {
        display: inline;
    }
}

Here is a great article that helped me with this solution.

Answer 6

I setup my print sheet to only print the modal content. My fix was to make the modal position: absolute;. My modal was originally position: fixed;.