Forum How do I...?

why does Prince think my HTML is taller than 11 inches ?

govinda
Hi everyone,

I am normally super self-sufficient, and have previously been using Prince successfully... but now I am banging my head trying to figure out some things about the way Prince (via docRaptor.com) is rendering (into PDF) my .html file.

Rather than post the HTML here.. in the interest of a making this post a little neater and cleaner, I posted it here instead:

http://www.yellow-turtle.com/_files2showPrinceForum_asking4help/sample4forum_Avery5167_01.html

Normally I use some dynamic code to serve a different version of the file to regular browsers (as opposed to docRaptor/Prince).. but in this file (URL just above), you will see the HTML/CSS just as it is when I hand it to Prince.

Questions... can anyone tell me *why*..:

1.) Why the CSS only works inline? (It does not recognize the page's stylesheet!? You can verify this fact by noticing the 'color:blue;' CSS rule in the file's stylesheet, on the <body> tag; the text is blue in the browser, but not in the PDF.)

2.) Why do the <div>s with 'id="labelInstance_n"' (which are floated) NOT float if I turn off the inline CSS border on the <div id="motherDiv"...>?

* 3.) Why are the last 2 rows of labels removed from the final PDF? If I take out the 'height:10.95in;' inline CSS rule from the <body> and <div id="motherDiv"...> tags.. then those last 2 rows of labels (labels # 73-76, and labels # 77-80) do not get dropped from the final PDF output by docRaptor/Prince, BUT they get put onto a second page of the PDF ! AFAICT that should not be, because the HTML/CSS is supposed to be outputting data for printing onto a single-page AVERY labels template (Avery template #5167).. which fits just right on an 8.5" x 11" standard sheet of paper, with .5" border on the top and bottom (between the paper edge and the data <div>s.

(* most important question, because I do not have any workaround.)

Thanks so much for any help!
-Govinda
mikeday
I'm having trouble reproducing these issues, for me the text shows up blue and all the text seems to fit, up to number 80 at the end. Which version of Prince are you using? Are you applying any additional style sheets? Can you post a link to the PDF that you have generated?
govinda
Hi Mike

thanks so much for replying!

OK, since you are seeing and expecting the file's stylesheet to work, then it means I should be able to use the
@page {
margin: 0cm;
}
rule, again.. and so I have gone ahead and regenerated the test page (where I stop trying to patch for the failing stylesheet), and the resultant PDF I am getting, and uploaded for you to see, here:

http://www.yellow-turtle.com/_files2showPrinceForum_asking4help/sample4forum_Avery5167_01.html
http://www.yellow-turtle.com/_files2showPrinceForum_asking4help/sample4forum_PDF_01.pdf

Like you said, the text is blue *in the webpage* in the web browser window.. BUT docRaptor is rendering the PDF as though there was no stylesheet.. and is only using the inline style rules.

I do not know how to check what version of Prince I am using because 'I am using' whatever version the folks at docRaptor are using to generate the PDFs for me. I had been assuming that docRaptor was an offshoot of the same people behind Prince. (I guess not? - since you did not pick up on my reference to docRaptor in my last post?) Anyway, docRaptor is a subscription service, driven by Prince, here:
http://docraptor.com/
Docraptor offers little documentation about how Prince generates the PDF from the HTML/CSS; they just offer a link to you guys, on their page here:
http://docraptor.com/documentation
..that page ^^^ has a link which goes here:
http://princexml.com/doc/7.0/
If that link to you in their docs is indicative of the Prince version (as it seems to imply) then the version would be 7.0, it seems. (?)

Anyway, without the stylesheet being used in the final rendered PDF, then you see that the text becomes black, an unwanted top and left margin is introduced, and (for the same reason, or another reason??) the bottom 8 labels (<div>s) get dropped. I was using inline styles to give the containing/wrapper <div id="motherDiv"...> a negative top and left margin.. to bring the <div id="motherDiv"...> back flush with the top and left edge of the page.. but your post has made me stop doing that, in hopes we find the *real* issue(s), and I can be rid of workarounds, and also solve the one thing I could not workaround (missing bottom 8 labels).

I am only using (trying to use) the one stylesheet which you can see in the <head> section of the html file whose URL is listed above. (There are no external stylesheet links.)

Thanks again for taking a look.. and please let me know if I can help you further.. to help me.
-Govinda
govinda
Mike, (and others reading this later)..

I just got help from the guys over at docRaptor.. and the issue turned out to be a couple hundred lines of white space between the <html> and <head> tag. They use version 7.1 as of now.. and it just happens to choke on that much white space at that location.. (drops the stylesheet). I removed all the extra white space before uploading that test page for you to look at (thinking it was irrelevant.. and would just add 5 seconds to your time while you scanned for any issue, on my behalf). Now we know. I hope thread saves someone some time later.
:)

Thanks again for even taking a peak Mike.

-Govinda
mikeday
Interesting, I would not have guessed that was the answer! Glad to hear it is working now. :)