You need to sign in to do that
Don't have an account?
hylim1215
Visualforce - missing table border in repeat header PDF
I have developed a Visualforce page to render in PDF and i use @page css for my repeating header and my header content contain a table with border-right:1px solid.
this is my CSS:
this my visualforce page:
The header is ok on the first page, but when on the second page and beyond, the table border is gone. Just pure table & content without border.
How can i remain the table border for every page?
this is my CSS:
html * { font-family: Arial Unicode MS; font-size:12px; } @page { size: A4; margin: 25pt .5in .5in .5in; margin-top:220px; margin-bottom:130px; @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-content); } @bottom-center{ content: element(footer-content); } } @page :first{ size: A4; margin: 25pt .5in .5in .5in; margin-top:190px; margin-bottom:130px; @top-center{ content: element(header-cover); } @bottom-center{ content: element(footer-cover); } } div.header-right { position: running(header-right); display: block; padding: 10px; } div.header-left { position: running(header-left); display: block; padding: 10px; font-size:40px; } div.header-cover { position: running(header-cover); display: block; padding: 10px; } div.header-content { position: running(header-content); display: block; padding: 10px; } div.footer-content { position: running(footer-content); padding: 10px; display: block; } div.footer-cover { position: running(footer-cover); padding: 10px; display: block; } div.footer-right { position: running(footer-right); padding: 10px; display: block; } td.pageHeaderCompany{ /*****NEW*****/ text-align:left; font-weight: bold; font-size:20px; font-family:sans-serif; color:#83bc34; letter-spacing:normal; vertical-align: top; } td.footerLabel{ font-size: 10px; text-align:right; } td.footerContent{ font-size: 10px; text-align:left; padding-left:15px; } tr.pageHeader{ /*****NEW*****/ font-size:12px; color:#001fa4; letter-spacing:normal; vertical-align: top; } tr.stdstyle{ text-align:left; letter-spacing:normal; vertical-align: top; }
this my visualforce page:
<html> <head> <style type="text/CSS" media="print"> <apex:outputPanel layout="none" rendered="{!!(Quote.status == 'Approved')}"> .watermark { background-repeat: repeat; background-image: url("{!URLFOR($Resource.Quote_Watermark)}"); } </apex:outputPanel> </style> </head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <body class="watermark"> <div class="header-content"> <table border="0" width="100%" cellspacing="0" cellpadding="0"> <tr> <td style="width:60%;"> </td> <td style="width:40%; align:right"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td style="border-right: 1pt solid #001fa4;">text</td> <td >text</td> </tr> <tr> <td style="border-right: 1pt solid #001fa4;">text2</td> <td >text2</td> </tr> </table> </td> </tr> </table> </div> <page body content here../> </body> </html>
The header is ok on the first page, but when on the second page and beyond, the table border is gone. Just pure table & content without border.
How can i remain the table border for every page?
Try the below visualforce page :
Regards,