Exporting PDF with jspdf not rendering CSS

Question

I am using jspdf.debug.js to export different data from a website but there are a few problems, I can't get it to render the CSS in the exported PDF and if I have an image in the page I am exporting, the PDF returns blank...

Does anyone know a way to fix this ?

Here is a jsfiddle showing it's not rendering the CSS

And my script

$(document).ready(function() {
$('#export').click(function(){
var d = new Date().toISOString().slice(0, 19).replace(/-/g, ""),
        filename = 'financiar_' + d + '.pdf',
        pdf = new jsPDF('p', 'pt', 'letter'),
        specialElementHandlers = {
          '#editor': function( element, renderer ) {
              return true;
          }
    };
    pdf.fromHTML(
          $('.export').get(0) // HTML element
        , 25  // x coord
        , 25  // y coord
        , {
              'width': 550 // was 7.5, max width of content on PDF
            , elementHandlers: specialElementHandlers
        }
    );
    pdf.save( filename );
})
});

Answer 1

As I know jsPDF is not working with CSS and the same issue I was facing.

To solve this issue, I used Html2Canvas. Just Add HTML2Canvas JS and then use pdf.addHTML() instead of pdf.fromHTML().

Here's my code (no other code):

 var pdf = new jsPDF('p', 'pt', 'letter');
 pdf.addHTML($('#ElementYouWantToConvertToPdf')[0], function () {
     pdf.save('Test.pdf');
 });

Best of Luck!

Edit: Refer to this line in case you didn't find .addHTML()