The library ignores position:absolute styling #203

zn · 2024-01-29T06:49:21Z

I have HTML code with many elements with style position: absolute. The HTML code looks good in the browser but when I try to convert it to pdf using HtmlRenderer.PdfSharp, I get all the elements in the top left corner. How can I fix this?

Here is my code:

using PdfSharp;
using PdfSharp.Pdf;
using TheArtOfDev.HtmlRenderer.PdfSharp;

var html = "...";
File.WriteAllBytes("draft.html", Encoding.UTF8.GetBytes(html));
using PdfDocument pdf = PdfGenerator.GeneratePdf(html, PageSize.A4, margin:0);
using var ms = new MemoryStream();
pdf.Save(ms);
File.WriteAllBytes("draft.pdf", ms.ToArray());
return ms.ToArray();

The html:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
</head>
<body>
    <p style="position: absolute; top: 50px; left: 200px;margin: 0;">Hello world!</p>
    <p style="position: absolute; top: 100px; left: 200px;margin: 0;">Hello world!1</p>
    <p style="position: absolute; top: 150px; left: 200px;margin: 0;">Hello world!2</p>
    <p style="position: absolute; top: 200px; left: 200px;margin: 0;">Hello world!3</p>
</body>
</html>

Below is how the generated pdf looks like:

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

The library ignores position:absolute styling #203

The library ignores position:absolute styling #203

zn commented Jan 29, 2024

The library ignores position:absolute styling #203

The library ignores position:absolute styling #203

Comments

zn commented Jan 29, 2024