Override CSS @page Rules with RenderingOptions
When an HTML document contains a CSS @page rule, its values (page size, orientation, and margins) take precedence over the corresponding properties set on RenderingOptions. Setting MarginTop, PaperOrientation, PaperSize, or similar properties on the renderer has no effect when the HTML defines conflicting @page values.
IronPDF renders via the Chrome engine, which follows standard CSS cascade rules. The @page rule is a document-level CSS declaration that the browser evaluates during rendering, overriding any programmatic rendering hints.
Solution
Option 1: Remove the @page rule from the HTML
Comment out or delete the @page block:
<style>
/*
@page {
size: A3;
margin-top: 2in;
margin-bottom: 2in;
margin-left: 2in;
margin-right: 2in;
}
*/
</style>With the rule absent, RenderingOptions properties take full effect.
Option 2: Programmatically neutralize the @page rule
If you cannot modify the HTML template, neutralize the rule in code before rendering:
string sanitizedHtml = html.Replace("@page", "/* @page */");
var renderer = new ChromePdfRenderer();
renderer.RenderingOptions.PaperSize = PdfPaperSize.A4;
renderer.RenderingOptions.MarginTop = 10;
PdfDocument pdf = renderer.RenderHtmlAsPdf(sanitizedHtml);
pdf.SaveAs("output.pdf");Imports IronPdf
Dim sanitizedHtml As String = html.Replace("@page", "/* @page */")
Dim renderer As New ChromePdfRenderer()
renderer.RenderingOptions.PaperSize = PdfPaperSize.A4
renderer.RenderingOptions.MarginTop = 10
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(sanitizedHtml)
pdf.SaveAs("output.pdf")
Curtis Chau holds a Bachelor’s degree in Computer Science (Carleton University) and specializes in front-end development with expertise in Node.js, TypeScript, JavaScript, and React. Passionate about crafting intuitive and aesthetically pleasing user interfaces, Curtis enjoys working with modern frameworks and creating well-structured, visually appealing manuals.
