0

I have a VFP rendered in PDF and I used @page for header & footer for my content. But we allow user to check/uncheck a 'Cover page' to show a cover page before all page.

How can i display my cover page as first page is its checked and follow by my content page starting from Page 1.

I have code like this:

<html>
    <head>
        <style type="text/CSS" media="print">

        @page CoverPage {

                size: A4;
                margin: 25pt .5in .5in .5in;
                margin-top:50px;
                margin-bottom:0px;


                @top-center{
                    content:
                }
                @bottom-center{
                    content:
                }

            }

            @page {
                size: A4;
                margin: 25pt .5in .5in .5in;
                margin-top:160px;
                margin-bottom:180px;


                    @top-left{
                        content: element(header-left);
                    }
                    @top-right{
                        content: element(header-right);
                    }
                    @bottom-left {
                        content: element(footer-left);
                    }
                    @bottom-right {
                        content: element(footer-right);
                    }
                    @top-center{
                        content: element(header);
                    }
                    @bottom-center{
                        content: element(footer);
                    }
            }
            div.coverpage1{
                page: CoverPage;
            }
     </style>
     </head>
     <div class="coverpage1" style="display:if checked">
         cover page content
     </div>

     <body class="watermark">
     <div class="header">
          header content
     </div>
     <div class="footer">
          footercontent
     </div>
      //body content goes here
     </body>

but my actual PDF have an empty first page and second page is my cover page and page 3 onward is my body content.

How can i make my cover page as first page & page number start from 1 starting from my body content?

Thanks.

0

You can do one thing here. Use page-break-after property

<div style="page-break-after: always;"></div>
<div class="coverpage1" style="display:if checked">
         cover page content
     </div>

     <body class="watermark">
     <div class="header">
          header content
     </div>
     <div class="footer">
          footercontent
     </div>

So this will insert a blank page for you.

|improve this answer|||||

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.