Huge white space after header in PDF using Flying Saucer

Question

I am trying to export an HTML page into a PDF using Flying Saucer. For some reason, the pages have a large white space after the header (id = "divTemplateHeaderPage1") divisions. The jsFiddle link to my HTML code that is being used by PDF renderer: https://jsfiddle.net/Sparks245/uhxqdta6/.

Below is the Java code used for rendering the PDF (Test.html is the same HTML code in the fiddle) and rendering only one page.

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.json.HTTP;
import org.json.JSONException;
import org.json.*;
import org.json.simple.JSONArray;
import org.json.JSONObject;
import org.json.simple.parser.JSONParser;
import org.json.simple.parser.ParseException;

import org.json.simple.parser.*;
import org.xhtmlrenderer.pdf.ITextRenderer;

import com.lowagie.text.DocumentException;
import com.lowagie.text.List;
import com.sun.xml.internal.bind.v2.runtime.unmarshaller.XsiNilLoader.Array;

import java.io.BufferedReader;
import java.io.File;
import java.io.FileOutputStream;
import java.io.FileReader;
import java.io.IOException;
import java.io.OutputStream;


@WebServlet("/PLPDFExport")
public class PLPDFExport extends HttpServlet 
{

    //Option for Serialization
    private static final long serialVersionUID = 1L;

    public PLPDFExport() 
    {
        super();
    }

    //Get method
    protected void doGet(HttpServletRequest request, 
                         HttpServletResponse response) 
                   throws ServletException, 
                          IOException 
    {

    }

    //Post method
    protected void doPost(HttpServletRequest request, 
                          HttpServletResponse response) 
                   throws ServletException, 
                          IOException
    {
            StringBuffer jb = new StringBuffer();
            String line = null;
            int Pages; 
            String[] newArray = null;

            try 
            {
                BufferedReader reader = request.getReader();
                while ((line = reader.readLine()) != null)
                {   jb.append(line);
                }
            } catch (Exception e) { /*report an error*/ }


            try 
            {
                JSONObject obj = new JSONObject(jb.toString());

                Pages = obj.getInt("Pages");

                newArray = new String[1];  
                for(int cnt = 1; cnt <= 1; cnt++)
                {  

                    StringBuffer  buf = new StringBuffer();

                    String base = "C:/Users/Sparks/Desktop/";

                    buf.append(readFile(base + "Test.html"));

                    newArray[0] = buf.toString(); 
                }
            } 


            catch (JSONException e)
            {
                // crash and burn
                throw new IOException("Error parsing JSON request string");
            }


            //Get the parameters

            OutputStream os = null;
            try {

                final File outputFile = File.createTempFile("FlyingSacuer.PDFRenderToMultiplePages", ".pdf");
                os = new FileOutputStream(outputFile);

                ITextRenderer renderer = new ITextRenderer();


                // we need to create the target PDF
                // we'll create one page per input string, but we call layout for the first

                renderer.setScaleToFit(true);
                renderer.isScaleToFit();
                renderer.setDocumentFromString(newArray[0]);

                renderer.layout();
                try {
                    renderer.createPDF(os, false);
                } catch (DocumentException e) {
                    // TODO Auto-generated catch block
                    e.printStackTrace();
                }

                // each page after the first we add using layout() followed by writeNextDocument()
                for (int i = 1; i < newArray.length; i++) {
                    renderer.setScaleToFit(true);
                    renderer.isScaleToFit();
                    renderer.setDocumentFromString(newArray[i]);
                    renderer.layout();
                    try {
                        renderer.writeNextDocument();
                    } catch (DocumentException e) {
                        // TODO Auto-generated catch block
                        e.printStackTrace();
                    }
                }

                // complete the PDF
                renderer.finishPDF();

                System.out.println("PDF Downloaded to " + outputFile );
                System.out.println(newArray[0]);

            }
            finally {
                if (os != null) {
                    try {
                        os.close();
                    } catch (IOException e) { /*ignore*/ }
                }
            }

            //Return
            response.setContentType("application/json");
            response.setCharacterEncoding("UTF-8");
            response.getWriter().write("File Uploaded");
    }

    String readFile(String fileName) throws IOException {
        BufferedReader br = new BufferedReader(new FileReader(fileName));
        try {
            StringBuilder sb = new StringBuilder();
            String line = br.readLine();

            while (line != null) {
                sb.append(line);
                sb.append("\n");
                line = br.readLine();
            }
            return sb.toString();
        } finally {
            br.close();
        }
    }

}

The link for exported PDF: https://drive.google.com/file/d/13CmlJK0ZDLolt7C3yLN2k4uJqV3TX-4B/view?usp=sharing

I tried adding css properties like page-break-inside: avoid to the header divisions but it didn't work. Also I tried adding absolute positions and top margins to the body division (id = "divTemplateBodyPage1") just below the header div, but the white space continues to exist.

Any suggestions would be helpful.

Answer 1

Please take a look at the metadata of your PDF:

You are using an old third party tool that is not endorsed by iText Group, and that uses iText 2.1.7, a version of iText dating from 2009 that should no longer be used.

It would probably have been OK to complain and to write "My code isn't working" about 7 years ago, but if you would use the most recent version of iText, the result of converting your HTML to PDF would look like this:

I only needed a single line of code to get this result:

HtmlConverter.convertToPdf(new File(src), new File(dest));

In this line src is the path the the source HTML and dest is the path to the resulting PDF.

I only had to apply one minor change to your HTML. I change the @page properties like this:

@page {
  size: 27cm 38cm;
  margin: 0.2cm;
}

If I hadn't changed this part of the CSS, the page size would have been A4, and in that case, not all the content would have fitted the page. I also added a small margin because I didn't like the fact that the border was sticking to close to the sides of the page.

Morale: don't use old versions of libraries! Download the latest version of iText and the pdfHTML add-on. You need iText 7 core and the pdfHTML add-on. You might also want to read the HTML to PDF tutorial.