CODEWITHSUNDEEP
htmlcsstwitter-bootstrapwkhtmltopdf
SBB
SBB

Reputation: 8970

Bootstrap to PDF Conversion

I am using Bootstrap 2.3 in a legacy tool to render a page that covers a project with at a glance details. I am trying to then render that single page as a PDF that can be downloaded.

I tried several tools including things like DOM 2 PDF but they require very basic html elements.

I found wkhtmltopdf and at the very basic level it seems to render the DOM correctly but I am running into some column issues.

The page it self has a 3 column structure, 3-6-3. When I render the pdf however, it turns all of the columns into 12 stacked on top of each other.

This is how the page looks in my UI: enter image description here

This is what my PDF looks like after exporting: enter image description here

So from what I can tell, its not using the print css because it would be a lot more basic than what it is. However I don't know why its spanning 12 cols and not the way I have it set up.

Is there some css I can add to the columns in order to have it render correctly?

UPDATE

I was actually able to pass a custom view port size using the plugin which then rendered the page correctly.

Upvotes: 2

Views: 3928

Answers (2)

Parag
Parag

Reputation: 11

You can use col-xs-* because PDF contains A4 size.

Upvotes: 1

Travis Collins
Travis Collins

Reputation: 4020

Looks like it's rendering at a lower viewport width. You could change your columns from col-md-6 to col-sm-6 for example, to change the breakpoint.

Upvotes: 0

Related Questions