HTML to PDF using iText External CSS

Question

I am using Flying Saucer to render some PDF documents from strings to HTML.

DocumentBuilder builder = DocumentBuilderFactory.newInstance().newDocumentBuilder();
InputStream is = new ByteArrayInputStream(html.getBytes("UTF-8"));
Document doc = builder.parse(is);

response.setContentType("application/pdf; charset=UTF-8");
response.setHeader("Content-disposition", "inline; filename=\"" + outFileName + "\"");

OutputStream os = response.getOutputStream();

ITextRenderer iTextRenderer = new ITextRenderer();
iTextRenderer.setDocument(doc,null);
iTextRenderer.layout();
iTextRenderer.createPDF(os);
os.flush();
os.close();

This works fine When I have plain text. I have referenced an external CSS in my HTML content. But, When PDF gets generated CSS doesn't get applied.

I have read that The setDocument() method takes two parameters: document and url. The url parameter indicates the base url used to prepend to relative paths that appear in the xhtml, such as an external CSS

So, I have tried to supply

context path/css

direcotry in the baseURL and used it in the setDocument() . Still no result

So, My Question What is the correct URL to pass as baseURL ?

String baseURL = ""; // What goes here as root URL for resources
iTextRenderer.setDocument(doc,baseURL);

Answer 1

The FAQ tells this:

The url is the "base", which for a normal URL would be the parent location—the parent directory, or the location where the document you are rendering is located.If your document has absolute URIs for CSS and images, or it has no external references at all, then the base url can be null.If your document has any relative URIs for CSS or images, then the base URL should not be null, but rather should point to the directory or address where the current document is located.

Did you test the path to your document instead of the path to your css? However, i had some trouble with linking CSS too so i inserted the URI (no problems so far :-) ). If you use a link as i posted above, does it work?

Sorry for new post, but comments told me i have only negative char's left ...

Answer 2

You can insert the CSS paths by putting
<link rel="stylesheet" type="text/css" href="file://path/to/your.css" />
into your document (head).

(In some cases you can use a simple path instead of an URI)

Answer 3

The problem is not the filepath, the problem is the media. One thing is to render to screen and other to render to print media like a pdf file. So you need to add an attribute to the stylesheet TAG inside your XML file.

From code.google.com/p/flying-saucer/wiki/FAQPDF

My PDF isn't picking up my CSS!

PDF is treated as "print" media; see the CSS 2.1 specification section on media types. Make sure you have specified the media type for your CSS when you link or embed it; use type "print" or "all".

The quick answer is to add the attribute media="all" to the XML stylesheet TAG like this:

<?xml-stylesheet href="foo.css" media="all" type="text/css"?>

alternative you can use media="print"