I'm using phantom-html2pdf to generate pdfs dynamically in a Node app. The conversion works but the layout is completely off. For example the html document is a form that consists of sections sometimes with two columns side-by-side. After the PDF conversion everything is in one column and generally pretty ugly.
I've tried adding custom CSS and adding pageSize
values but no matter what I do it's not producing the result I need.
Here is what I have in options at the moment. Note I've passed through some css where I try to "reshape" the document to make it more like the original HTML but it seems to have limited effect on the final layout. Also I set a negative border which helps a bit but doesn't remove PDF border completely as I'd like.
Just one detail, I am using MUI css for some styling and layout which has been in-lined into the HTML before the PDF conversion.
var pdfOptions = {
html: html, // html with in-lined MUI styles
css: pdfCss, // This CSS seems to have has limited control over final layout
paperSize: {format: 'A4', orientation: 'portrait', border: '-2cm'}
}
If anyone has any advice on how to get more control over the layout to make it look more like my HTML I'd be very grateful. Cheers!
via mikeym
No comments:
Post a Comment