Cannot apply CSS to the html string

3.3k views Asked by At

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....

2

There are 2 answers

2
Nick Larsen On

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.

0
smoore4 On

I ran into this issue with EvoPdf. The fix for me was to reference the baseURL from web.config. I was trying to use HttpContext.Current.Request.Url.AbsoluteUri; which worked in two environments but didn't when tested on another server.

  <appSettings>
    <add key="baseURL" value="http://your-domain.com/" />
  </appSettings>

So you set it specifically and the CSS shows correctly after the change. Works with https too. You can hard code it for testing and not use ConfigurationManager.

        TextWriter outTextWriter = new StringWriter();

        Server.Execute("Page1.aspx", outTextWriter);
        Server.Execute("Page2.html", outTextWriter);

        string htmlStringToConvert = outTextWriter.ToString();
        outTextWriter.Close();

        // Use the current page URL as base URL
        string baseUrl = ConfigurationManager.AppSettings["baseURL"].ToString(); //HttpContext.Current.Request.Url.AbsoluteUri;

        // Convert the page HTML string to a PDF document in a memory buffer
        byte[] outPdfBuffer = htmlToPdfConverter.ConvertHtml(htmlStringToConvert, baseUrl);