Phantomjs: PDF document has additional empty page at the end

[wawanawna]

_[email protected] commented:_

Thanks for this nice tool at first.

I have small problem with rendering pdf file: sometimes pdf file has an extra page at the end and this page is empty.

It will be great if I could avoid this page.

Disclaimer:
This issue was migrated on 2013-03-15 from the project's former issue tracker on Google Code, Issue #582.
:star2:   4 people had starred this issue at the time of migration.

[ariya]

_[email protected] commented:_

Just asked about this on the ML, too: https://groups.google.com/forum/?fromgroups#!topic/phantomjs/SFwSfpGqIEo

[ariya]

_[email protected] commented:_

Without any simple test case to reproduce, it won't be easy to troubleshoot.

[ariya]

_[email protected] commented:_

Hi,
I'm seeing this as well. Sample code is attached.
Regards,
Andy

[ariya]

_[email protected] commented:_

I just wanted to give this issue a bit of a bump. This is really a serious issue for our users. Our clients produce pdfs for printing purposes on card stock and more expensive papers, an extra page will really annoy folks.

Is there any word on whether a fix might be in the works?

Thanks,
Laura

[ariya]

_[email protected] commented:_

Laura, if there is no info posted on an issue, then there is nothing more about that.

Quoting the FAQ (http://phantomjs.org/faq.html):

Q: Is there any update on issue XYZ??

Any progress related to an issue, whether it is a change in the plan or an implementation check-in, will be always posted to the issue page. This is part of PhantomJS contribution guide, it is essential to the development workflow. If an issue hasn't received any new update for a while, a question like "Is there any update?" has an obvious answer.

[ariya]

_[email protected] commented:_

I also get these trailing white pages. Especially on pages containing elements with css "display: none;". Could it be that their height/dimension still somehow counts?

I studied the example page in the test posted in comment #3, and it also contains display:none elements.

[mark-hahn]

I don't know how to star an issue on github so I'm posting here to ask to bump the priority for this. It is a serious problem for us also.

Oops, I found the star button above. I see the star count is up to 6,592. Surely this can be moved from medium to high priority.

[JamesMGreene]

The star count is for the project, not the issue. GitHub no longer has star counts for issues.

Also, if you are working with a PDF file, there are plenty of utilities for removing/ splitting/merging PDF files until this issue gets fixed.

If it is an extremely high priority for you, we encourage you to contribute by tracking down the root cause or even fixing it and submitting a Pull Request to fix it in the master branch.

[mark-hahn]

Thanks, I didn't know I could strip the page with a utility. I did try to
track down the cause but I was unsuccessful.

On Fri, Jun 21, 2013 at 12:49 PM, James M. Greene
[email protected]:

The star count is for the project, not the issue. GitHub no longer has
star counts for issues.

Also, if you are working with a PDF file, there are plenty of utilities
for removing/ splitting/merging PDF files until this issue gets fixed.

If it is an extremely high priority for you, we encourage you to
contribute by tracking down the root cause or even fixing it and submitting
a Pull Request to fix it in the master branch.

—
Reply to this email directly or view it on GitHubhttps://github.com/ariya/phantomjs/issues/10582#issuecomment-19836968
.

[JoshBauguss]

for those of you still experiencing this issue. Try using Normalize.css code from http://necolas.github.io/normalize.css/.

This issue really stems from how browsers render things around the box model. This css script makes things a little more sane and what you would expect cross browser.

For me, it removed the 3rd page with very little modification needed to the rest of my css.

[gockxml]

try to add overflow:hidden to the wrapper of every page. It fixed my problem.

[gogson]

+1

[togakangaroo]

Adding normalize.css fixed the blank page for me. It also removed a left padding, but added some sort of bottom padding

[agairing]

overflow:hidden did the trick.

[ebdrup]

Adding overflow:hidden to all my container elements, and adding normalize.css did not fix the bug for me. I discovered that the root html-element in the HTML DOM was causing the issue, probably because I was compensating for the phantom 2.1 pdf scaling bug https://github.com/ariya/phantomjs/issues/12685

The fix for this was adding this code:

var $html = $(document.getElementsByTagName('html')[0]);
$html.height(0);

(I'm using jQuery, because we already have it on the page, there should be an easy Vanilla JS solution too)

[Llorx]

Mixing jQuery and default Javascript is never a good idea.

As webpages only have one html element, you can do:

$("html").height(0);

And if you really want to apply it to the first element, you can do:

$("html").first().height(0);

I feel a bit Stack Overflow right now... xD

EDIT: Yay, your fix worked.

Instead of Javascript I used CSS. Just added:

html {
    height: 0;
}

And it worked like a charm.

[Quovandius]

Tips of @Llorx works for me ;) thx for this

[gletsch]

Also had this problem after scaling down a table, the provided fix by ebdrup worked like a charm :1st_place_medal: . Thanks a lot, i was already ripping my hair out because of that :)
PS.: jQuery isnt needed at all for his fix, it also works in an css tag

[stale[bot]]

Due to our very limited maintenance capacity (see #14541 for more details), we need to prioritize our development focus on other tasks. Therefore, this issue will be automatically closed. In the future, if we see the need to attend to this issue again, then it will be reopened. Thank you for your contribution!