+ Start a Discussion
Jina ChetiaJina Chetia 

How to give page breaks in a VisualForce page rendered as a pdf?

Hi,

I have a Visual Force page which I am rendering as a pdf. I want to add page breaks to the pdf file because if the page is longer than 1 page it just splits up the page wherever it runs over. Is there any way I can control this?

Thanks
Jina
Jim BoudreauxJim Boudreaux

Hey, I'm running into the same issues with the pdf feature. I have the beginnings of a solution, so it may or may not help.

Code:
<apex:page showheader="false" renderas="pdf" >
<style>
@page :first{
    size: 8.5in 11in portrait;
    margin-left: 3cm;
    margin-right: 3cm;
    }
@page {
    @bottom-center { content:"Page " counter(page);
    margin-left: 3cm;
    margin-right: 3cm;
  }
      }
@page :left {
    size: portrait;
    margin-left: 6cm;
    margin-right: 3cm;
    }
@page :right {
    size: portrait;
    margin-left: 3cm;
    margin-right: 6cm;
    }
div.left {page:left;}
div.right {page:right;}
body {
       font-family: Arial Unicode MS;
       font-size:   5em;
    }
</style>
<b>First Page</b>
<div class="left">
This is text that goes on the left page
</div><div class="right">
This is text that goes on the right page
</div>
<div class="generic">
This is text that is not assigned to any particular page style and yet it maintains the left and right styling. As you can see, it still splits the content among pages, and the page style is maintained.</div>
</apex:page>

This code takes the content in the different divs and puts it on its own page. It still splits the content where needed, but as you can see in the left and right page examples, you can explicitly break content among pages where needed. 
 

Jina ChetiaJina Chetia
Thanks for the solution. But I did not understand about the right and left page. I want one single page but the content distributed in a logical two pages if it exceeds a single page. Will the code be same even for this scenario?
kyleRochekyleRoche
I haven't tried this yet... but, in a browser you could try:
<div style="page-break-after:always;">

content of page one here

</div>

the rest. please post and let us know if that works.
p1_dfsp1_dfs
I am able to display the page number using the @page rule of CSS. But I am creating a PDF document which uses multiple <DATATABLE> and <PANELGRID>  tags to display the header and detail informations.

I am to be able to repeat the header information (displayed using <PANELGRID>) in  all pages. But in the detail since I am using <DATATABLE> and if there are several records, I am not able to repeat any header information on to next page.

Can anyone suggest a way to repeat header information on all pages.
kyleRochekyleRoche
To stick w/ the topic of this post... how did you get the page breaks to work?
Jina ChetiaJina Chetia
The page breaks works with the code
<div style="page-break-after:always;">

content of page one here

</div>

but my requiremnet is to dynamically give these page breaks once the lenght of page exceeds 1 page or else it should come in one page? Got an idea how to achieve this?
gtuerkgtuerk
I have the same requirement for an order form that may exceed one page in length and I do not wish to break the footer (containing legalese) in half.  Does anyone have a solution for the dynamic nature of this request?
sumitasumita
Hi,
 
Sorry to beat a dead horse! but, i have done some visualforce stuff in which, there is a button on account detail page, which takes the account id and calls a vf page. in that vf page, i have displayed some content, and onload i am calling a controller function to capture the content of the vf page(through getContent() ), and generate a ppt as a document and an attachment to account object.

everything seems fine until, the final ppt gets generated. because in the final ppt, all the matter comes into a single slide, and i want that certain matter should some in certain slide and so on. so i want to get slide breaks(page breaks). when i do that in word or pdf, i am able to get page breaks, by using the following:

<div id="div1" style="page-break-before: always;"></div> <!-- in pdf -->
or
<br clear="all" style="page-break-before:always" /> <!-- in word -->


 please guide me as to how i can achieve this?


thanks,
Sumita

Jen BennettJen Bennett

I know this is an older post, but wanted to share in case others are still looking for a solution. I was having a similar issue but instead of putting in page breaks, I took a different route and gave my sections the page-break-inside: avoid; style. This kept my sections together and gave me clean breaks.

Mitesh SuraMitesh Sura
Thank you @jjbennett530 You saved my day.
Nikolajs Mitjuls 11Nikolajs Mitjuls 11
Thank you @Jen Bennett ! It works for me as well.
uday bhaskaruday bhaskar
Thanks, Jen Bennett! It saved my day.