+ Start a Discussion
Robbert Bos2Robbert Bos2 

MS Word (render) blank page

I'm trying to render a MS Word document from a visualforce page. But because of the use of the header/footer I get a blank second page.

Does anybody know how to get rid of the blank page? I tried several CSS and scripts.
 
<apex:page standardController="mployeeTime__timeSheetMonth__c" extensions="API_timeSheetMonthExtension" sidebar="false" contentType="application/msword#test.doc" cache="true">
<html xmlns:w="urn:schemas-microsoft-com:office:word">
<apex:variable var="item" value="{!mployeeTime__timeSheetMonth__c}" />

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<style>

body {
        font-family:DINPro-Light, Verdana, Arial;
        font-size: 11px;        
    }

table {
        width:100%;
    }
    
.tablehours    {
    font-size: 9px;
    width:60%;
   }

    table td {
        width:25%;
    }
    table td.odd {
        background-color:#999;
    }
    
    table.line-items tbody tr td:last-child {
        border: none;
    }

    table.line-items tbody tr td {
        border-right: thin solid #999;
    }
    
p.MsoHeader, li.MsoHeader, div.MsoHeader    {
    margin:0in;
    margin-top:.0001pt;
    mso-pagination:widow-orphan;
    tab-stops:center 3.0in right 6.0in;
    }
    
p.MsoFooter, li.MsoFooter, div.MsoFooter    {
    margin:0in;
    margin-bottom:.0001pt;
    mso-pagination:widow-orphan;
    tab-stops:center 3.0in right 6.0in;
    font-family:DINPro-Light, Verdana, Arial;
    font-weight:normal;
    font-size:7.5pt;
    }
    
@page Section1    {
    size:8.5in 11.0in; 
    margin:0.5in 0.5in 0.5in 0.5in;
    mso-header-margin:0in;
    mso-header:h1;
    mso-footer:f1; 
    mso-footer-margin:0.2in;
    mso-paper-source:0;
    }
    
div.Section1    {
    page:Section1;
    }

table#hrdftrtbl{
    margin:0in 0in 0in 9in;
    }      

h2  {
    font-family:DINPro-Light, Verdana, Arial;
    font-weight:normal;
    font-size:20pt;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    line-height: 19pt;
    color:#84BFC5;
    text-align:right;
    }
    
h3  {
    font-family:DINPro-Light, Verdana, Arial;
    font-weight:normal;
    font-size:20pt;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    line-height: 19pt;
    color:#6D6966;
    text-align:right;
    }

</style>
</head>

<div class="Section1" style="page-break-after:always;">       

<center><div style="font-weight:bold; font-size: 14px;">Urenverantwoording</div></center>
<hr/>      

<!-- invoice-details V I-->
<apex:panelGrid rendered="true"  columns="4" id="invoice-details-I">
    <b>Periode</b>
    <apex:panelGroup >
        <apex:outputField value="{!item.mployeeTime__periodStartDate__c}" />
        &nbsp;t/m&nbsp;
        <apex:outputField value="{!item.mployeeTime__periodEndDate__c}" />
    </apex:panelGroup>
    <b>Contactpersoon</b>                    
    <apex:outputLabel value="Marcel" />
    
    <b>Naam consultant</b>                
    <apex:outputField value="{!item.mployeeTime__Employee__c}" />
    <b>Afdeling</b>
    <apex:outputText value="{!item.mployeeTime__Assignment__r.mployee__ProjectName__c}" />
    
    <b>Debiteurnummer</b>
    <apex:outputText value="{!item.mployeeTime__Assignment__r.Name}"/>
    <b>Datum</b>
    <apex:outputText value="{0,date,dd'-'MM'-'yyyy}" >  
        <apex:param value="{!item.LastModifiedDate}" />
    </apex:outputText>                   
    
</apex:panelGrid>     
<hr/>

<table class="tablehours" border="1" align="center">
    <thead>
        <tr>
            <th class="label-bg" scope="col">Datum</th>
            <th class="label-bg" scope="col">Uren</th> 
        </tr>
    </thead>
    <tbody>
        <apex:repeat value="{!TimeSheet}" var="entry" >    
            <tr>
                <td align="right">
                    <apex:outputText value="{0,date,dd'-'MM'-'yyyy}" >  
                        <apex:param value="{!entry.date1}" />
                    </apex:outputText>
                </td>    
                <td align="right">
                    <apex:outputText value="{0,number,#,00.00}">
                         <apex:param value="{!entry.durations0}" />  
                    </apex:outputText>
                </td>
            </tr>
        </apex:repeat>
    </tbody>
    <tr>
      <th scope="row">Totaal</th>
      <th scope="row" align="right">
          <apex:outputText value="{!mployeeTime__timeSheetMonth__c.Totaal_gewerkte_uren__c}"/>
      </th>
    </tr>    
</table>     

<table width="50%" border="0" cellspacing="0" cellpadding="0">
    <br/>
    <tr>
        <td>Datum:</td>
        <td>Datum:</td>
    </tr>
    <tr>
        <td>Opdrachtgever:</td>
        <td>Professional:</td>
    </tr>  
</table>
<!--Header and Footer-->
<table id='hrdftrtbl' border='0' cellspacing='0' cellpadding='0'>
    <tr>
        <td>
            <!--Header-->
            <div style='mso-element:header' id="h1" >
                <p class="MsoHeader">
                    <table border="0" width="100%">
                        <tr>
                            <td width="30%">
                                <img src="" style="align:left"/>
                                <p>&nbsp;</p>
                            </td>
                            <td align="center" width="40%">
                            </td>
                            <td align="right" width="30%">
                                <h3>We</h3>
                                <h2>Know</h2>  
                                <h3>it</h3>
                                <p>&nbsp;</p>
                            </td>
                        </tr>
                    </table>
                </p>
            </div><!--Header einde-->
        </td>
        <td>
            <!--Footer-->
            <div style='mso-element:footer' id="f1">
                <p class="MsoFooter">
                    <table width="100%" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                            <td align="center" width="100%">
                                <p align="center" class="MsoFooter">bla bla bla bla</p>
                                <p align="center" class="MsoFooter">bla bla bla bla</p>
                            </td>
                           
                        </tr>
                    </table>
                </p>
            </div><!--Footer einde-->
        </td>
    </tr>
</table><!--Header and Footer einde-->
 
</div><!--Section1 div einde-->

</html>
</apex:page>

 
Best Answer chosen by Robbert Bos2
SandhyaSandhya (Salesforce Developers) 
Hi Robbert Bos,

when using the page-break-after:always for the tag it will create a page break after the last bit of the table, creating an entirely blank page at the end every time! To fix this just change it to page-break-after:auto. It will break correctly and not create an extra blank page.

From below link try this if it helps you.

http://salesforce.stackexchange.com/questions/95439/stop-blank-page-being-created-because-of-page-break-setting-at-end-of-visualfo
 
Hope this helps you!

Please mark it as Best Answer if my reply was helpful. It will make it available for other as the proper solution. 
 
Thanks and Regards
Sandhya

 

All Answers

SandhyaSandhya (Salesforce Developers) 
Hi Robbert Bos,

when using the page-break-after:always for the tag it will create a page break after the last bit of the table, creating an entirely blank page at the end every time! To fix this just change it to page-break-after:auto. It will break correctly and not create an extra blank page.

From below link try this if it helps you.

http://salesforce.stackexchange.com/questions/95439/stop-blank-page-being-created-because-of-page-break-setting-at-end-of-visualfo
 
Hope this helps you!

Please mark it as Best Answer if my reply was helpful. It will make it available for other as the proper solution. 
 
Thanks and Regards
Sandhya

 
This was selected as the best answer
Robbert Bos2Robbert Bos2
Thanks! In addition to this I changed the margins and content a bit; because it was to much for one page.