Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cannot apply CSS to the html string

I am trying to integrate evoPDF on my asp.net app. I am sending part of html from my html file onclick through ajax. Everything works fie till this part. Now, when I invoke these methods from EvoPdf API.

 1. GetPdfBytesFromHtmlStream(Stream, Encoding,urlbase)

 2. SavePdfFromHtmlStringToFile(String html,string filename,urlbase)

My html chunk I am sending is something like

 <ol class = "lol">
         <li> HEY </li>
         <li> Now </li>

  </ol>

The Css which is in the external file is something like

 .lol {

      background-color: red;

  }

According to the documentation the third argument must be the full url of the originial Html where you extracted the chunk of the html. I uploaded my app in the web since trying localhost/3232 didn't work. But, I can't see any CSS being applied in the generated Html. In the documentation they also recommended to append

       <HEAD> <BASE HREF="full url to your html file"> </HEAD>

And, use this method.

        pdfConverter.GetPdfBytesFromHtmlString(String html);

Nothing I tried above applies CSS. Any thoughts....

like image 975
Rabin Avatar asked Aug 06 '13 14:08

Rabin


People also ask

How do I apply a CSS to a string?

The string is not an HTML element so you cant apply any css to it. The best you can do is append class='table1' to the <table> tag in your string in case you render it to html later on.

How do you add CSS to HTML?

CSS can be added to HTML documents in 3 ways: Inline - by using the style attribute inside HTML elements. Internal - by using a <style> element in the <head> section. External - by using a <link> element to link to an external CSS file.


1 Answers

While it's possible to have the html in an external file with evoPDF, I don't recommend it. Instead just inline the styles in the head of the document. When we were setting up the PDF generator for Careers 2.0, I remember that the urls had to be live urls, behind a web server, not just relative link in the same directory structure. There is also a timeout in evo pdf that can cause loss of images if loading takes too long, which also plays nicer with inline everything.

I also recommend passing it fully valid html, not just the snippets you need to generate the view. Behind the scenes (in our version of evoPDF at least), it's just hoisting a browser instance and taking a screenshot. They render a little differently depending on the doctype.

like image 71
Nick Larsen Avatar answered Sep 30 '22 05:09

Nick Larsen