We're sorry Aspose doesn't work properply without JavaScript enabled.

Free Support Forum - aspose.com

HTML to PDF - Header/Footer rendering problem

Hello,

there seems to be a problem with converting a HTML file as header or footer in a PDF. In the main content every HTML container gets rendered as I defined it. All margin and padding values are interpreted fine. But when I set margin or padding in a header or footer file, it gets not rendered. As soon as I set a background-color or add text content in it, the padding gets rendered fine, but I need it without background-color. So I tried to set a transparent color (background-color: transparent; or background-color: rgba(0,0,0,0):wink: or transparent pixel.gif (or png), but non of my tries are working.

EXAMPLE

C#

var myMainViewAsString = “…”; // *1
var
doc = new Document(new MemoryStream(System.Text.Encoding.UTF8.GetBytes(myMainViewAsString)));
var
header = new HeaderFooter { Margin = { Top = 0, Bottom = 0, Left = 0, Right = 0 }};
var myHeaderViewAsString = “…”; // *2
header.Paragraphs.Add(new HtmlFragment(myHeaderViewAsString));
doc.Pages[1].Header = header;

*1 = this content in the main area is rendered fine with all margins and paddings
*2 = this content in the header area is rendered without margin and paddings, till I add a background-color or symbol in it


Cshtml (see var myHeaderViewAsString)
<!DOCTYPE html>
<
html>
<
head>
<title>Header</title>
<link type=“text/css” rel=“stylesheet” href=“Style.css />
</
head>
<
body>
<div id=“header”>
<h1>Headline text</h1>
</div>
</
body>
</
html>


Style.css

#header {
padding: 10px 0 0 10px; // this is not working
}
#header
h1 {
background-color: black;
padding: 5px; // this is working
margin: 10px 0 0 10px; // this is not working
}


Could you please confirm this wrong behaviour and give me feedback about it? Or am I doing something wrong here? Thanks in advance.

Hi Philipp,


Thanks for your inquriy. Please note you are setting Header margins 0 in your code so it overriding the HTML CSS properties. Please check following code snippet, hopefully it will help you to accomplish the task. However if there is any difference in your requirements and my understanding then please share some more details along with your sample output and expected output as well, so we will further look into it and will guide you accordingly.

…<o:p></o:p>

....

var header = new Aspose.Pdf.HeaderFooter();

//{ Margin = { Top = 0, Bottom = 0, Left = 0, Right = 0 } };

string myHeaderViewAsString = new StreamReader(myDir + "headerstyle.html").ReadToEnd(); // *2

HtmlFragment html = new HtmlFragment(myHeaderViewAsString);

//referring CSS file basepath

html.HtmlLoadOptionsOfInstance = new HtmlLoadOptions(myDir);

header.Paragraphs.Add(html);

....

....


Best Regards,

Thank you for your answer.

An abstract example of what I want to do:
I have multiple cshtml templates to create my result PDF. Lets say all templates just have a H1 heading as content inside. One template is designed to have the H1 on the top left corner without any margins. Another template needs a margin (or to use another word: a “spacer”) relative to the top left corner. Therefore I added the #header div wrapper around the H1 and tried to add a margin or padding to it, but it did not worked till I added a background-color or symbol in it, as I said in the first post.

With your code snippet, the header margin would be set again with the C# code, right? But I need to set it dynamically in my CSS Code. Is there any other possibility to solve this, or is this (Post 1) maybe a bug in Aspose PDF? I am just confused that margins and paddings are working fine in my main area.

Hi Philipp,


Thanks for your feedback and additional information. Please note I have not set margin via C# code but via CSS. For testing I have changed margin values in CSS file as following.

#header {<o:p></o:p>

padding: 100px 0 0 50px; // this is not working

}

#header h1 {

// background-color: black;

padding: 100px; // this is working

margin: 100px 0 0 50px; // this is not working

}


Best Regards,

I just tried your example. Btw. thank you for the hint with HtmlLoadOptionsOfInstance, because I used an absolute path for my CSS file before! :slight_smile:

When I remove the setters of the Margin property, I get a default margin to the left and the right (but not top or margin). Thats the first problem, because I need to start at x=0 and y=0 of the whole page. Also the padding and margin values still get not rendered. I tried to set the margins and paddings to the #header and also h1 but there is just no differences. But my css file gets processed, because other styles are rendered.

My only difference to your snippet is, that I convert a razor view with a model to a string.


var myHeaderViewAsString = RenderRazorViewToString(PathToHeaderCshtml, modelForView);

public string RenderRazorViewToString(string viewName, object model)
{
ViewData.Model = model;
using (var sw = new StringWriter())
{
var viewResult = ViewEngines.Engines.FindPartialView(ControllerContext, viewName);
var viewContext = new ViewContext(ControllerContext, viewResult.View, ViewData, TempData, sw);
viewResult.View.Render(viewContext, sw);
viewResult.ViewEngine.ReleaseView(ControllerContext, viewResult.View);
return sw.GetStringBuilder().ToString();
}
}

But the result should be the same as in your code. And the cshtml contains a whole valid HTML5 construct as I wrote in my first post here.

I am using Aspose.PDF 11.5.0. You also ran the code and get it worked as it should?

You can find an example project in the attachment. As you see, there is a default margin on the left and right side, that I want to remove. Also the margin-left rule is not rendered as it should, its added on the right side.

Hi Philipp,


Thanks for sharing sample project. I am looking into it and will update you soon.

We are sorry for the inconvenience caused.

Best Regards,

Have you found the error?

Hi Philipp,


I am sorry for the delayed response. I have tested the shared project and noticed that margins from css are not honoring in HtmlFragment in page Header, so logged a ticket PDFNEWNET-40689 in our issue tracking system for further investigation and rectification. We will keep you updated about the issue resolution progress.

We are sorry for the inconvenience caused.

Best Regards,