Print this page

How to Format a VisualForce Page rendered as PDF

Knowledge Article Number 000004706

VisualForce allows you to create PDF documents (<apex:page RenderAs="PDF">), but did you know those files can be easily manipulated with CSS, for example you can break a document on different pages, you can set footers and headers, set the page size, and add page numbering. 


You can find a very good document on how to use CSS to format PDF files here:

This page creates a PDF file that:


  • Uses "Letter" as the paper size
  • Has margins of 1/4 centimetres
  • Has a title on every page
  • Every page shows the page number in this format (page # of #)
  • Controls what content goes on each page.

Note: Provided solution may not work for all situations. You may have to enable/disable <apex:page> options to get the desired result.

<apex:page renderAs="pdf" showHeader="false" sidebar="false" standardStylesheets="false" applyBodyTag="false" applyHtmlTag="false">
            @page {
                size: letter;
                margin: 25mm;
                @top-center {
                    content: "Sample";
                @bottom-center {
                    content: "Page " counter(page) " of " counter(pages);
            .page-break {
            body {
                font-family: Arial Unicode MS;
    <div class="page-break">Page A</div>
    <div class="page-break">Page B</div>
    <div>Page C</div>

promote demote