Best way to print HTML designed content?

Question

I have a web app that let users design their own invitation cards that are then ordered and printed by us, and send to the customer.

The problem we have is, it's difficult to print the cards, exactly the way the user designed it. We are currently using wkhtmltopdf to export a pdf file from the users design, that is then send to print. This has caused us months of headache. See this example:

As you can see, there are some important differences between the result of the HTML and the PDF. Most noticable is the line break of "Välkommen på". Other common differences is line-height changing so that text overlap eachother on the PDF file, because they are more, or less seperated from eachother than in the HTML.

My questions to you is:

1. Would you use this method or is there any other, simpler method could use to print the cards? For example, is there an easy way to just print the HTML itself from the browser (Auto fitting to the correct size of the content and so on), or do you have any other idea?
2. If you are a wkhtmltopdf wizard, do you know how we can solve issues like in the picture with the fonts?

Answer 1

I was able to solve the problem with the line breaks by using the CSS Attribute white-space: nowrap on all divs of my HTML content.