0

I have just created a simple box on visualforce page rendering as PDF and it is coming out as below

enter image description here

At the top of the box, I have apex repeat, so this box's position would be dynamic as per the data on apex repeat tag.

I used below CSS to create the box

  .box {
                border: 1px solid black;
                margin: auto;
                width: 60%;
                text-align: center;
                height: 80px;
            }

HTML :

<div class="box ">
            <p class="signature">
                some text
            </p>
        </div>

and also sometimes if a td table data renders close to page split then comes as below

enter image description here

it vertically cuts the few portions of the line

in the code I have simple table tag with some td tags and no custom css added,

can anyone please suggest how to handle page break or is it possible to render everything on one long single page instead of splitting into multiple pages.

1 Answer 1

2

With a table, you should be able to use something like this:

<style type="text/css">
   table { page-break-inside:auto }
   tr    { page-break-inside:avoid; page-break-after:auto }
</style>

I borrowed this from this answer on SO.

If you decide to remove the table, which I'd recommend, you can use page-break-before, page-break-inside, and page-break-after to force rendering on page boundaries.

You can also increase the page size:

<style>
  @page { margin: 0.25in; size: 8in 24in; }
</style>

Where the size is the width and height you desire.

2
  • Thank you so much for your answer the 2nd css worked like a magic but by any chance can we make it dynamic if possible? and also, I applied the above CSS to table but the issue is still the same and my box is not inside the table it is out side the table and repeat tag and box is still splitting into 2 pieces, would you please suggest?
    – gs650x
    May 7, 2021 at 5:08
  • I have added page-break-inside:avoid; to my box div and it worked as expected, thank you
    – gs650x
    May 7, 2021 at 10:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.