Apex Code Development You need to sign in to do that
Don't have an account?
BobP apex:repeat row alignment shifts left on the bottom
I am working on a visualforce page that has an issue with the last two rows shifting to the left.
Below is the VF code. The code is looking at a number field to simulate months in a year. The last two <outputPanel>'s shift to the left for some reason and I cant figure it out.
If I move those two panels somewhere in the middle of the code it aligns perfectly.
Any help on this would be greatly appreciated.
Below is the VF code. The code is looking at a number field to simulate months in a year. The last two <outputPanel>'s shift to the left for some reason and I cant figure it out.
If I move those two panels somewhere in the middle of the code it aligns perfectly.
Any help on this would be greatly appreciated.
<apex:page standardcontroller="Account" renderas="pdf" extensions="AccountExtensionController" standardstylesheets="false" showheader="false" applyhtmltag="false">
<form >
<html xmlns="http://www.w3.org/1999/xhtml">
<body style="color:#000000;border-style:solid; border-width:0px; width:85%; text-align:center">
</body>
<table align="center" width="85%" style="font-family: Arial, Helvetica, sans-serif;text-align:left;"
cellpadding="2">
<tr>
<td colspan="4" style="font-size:12px; font-weight: normal">
</td>
</tr>
<tr>
<td colspan="4" style="font-weight:bold ; border-style:solid; border-width:1px;
border-color:#000000;padding:3px;text-align:center;background-color:#B4C6E7">
SERVICE PARTNER DETAILS
</td>
</tr>
</table>
<table align="center" width="85%" style="font-family: Arial, Helvetica, sans-serif; text-align:left;"
cellpadding="2">
<tr>
<td width="50%" align="left" style="color: #000000;text-align:left; border-left-style: solid; border-left-width: thin;
border-left-color: #ffffff;font-style:normal; font-weight:normal;padding:3px;padding-top:10px">
<b>Company</b> {!Account.Name} </td>
<td width="50%" align="right" style="color: #000000;text-align:left; border-right-style: solid; border-right-width: thin;
border-right-color:#ffffff;font-style:normal; font-weight:normal;padding:3px;padding-top:10px">
<b>Office Phone</b> {!Account.Phone} </td>
</tr>
<tr>
<td width="25%" align="left" style="color: #000000;text-align:left; border-left-style: solid; border-left-width: thin;
border-left-color: #ffffff;font-style:normal; font-weight:normal;padding:3px">
<b>Contact</b> {!Account.Primary_Field_POC__r.FirstName} {!Account.Primary_Field_POC__r.LastName} </td>
<td width="25%" align="left" style="color: #000000;text-align:left; border-right-style: solid; border-right-width: thin;
border-right-color: #ffffff;font-style:normal; font-weight:normal;padding:3px"><b>Cell Phone</b> {!Account.Secondary_Phone__c}
</td>
</tr>
<tr>
<td width="25%" align="left" style="color: #000000;text-align:left; border-left-style: solid; border-left-width: thin;
border-left-color: #ffffff;font-style:normal; font-weight:normal;padding:3px">
<b>Street Address</b><br/> {!Account.BillingStreet} </td>
<td width="25%" align="left" style="color: #000000;text-align:left; border-right-style: solid; border-right-width: thin;
border-right-color:#ffffff;font-style:normal; font-weight:normal;padding:3px"><b>Fax</b> {!Account.Fax}
</td>
</tr>
<tr>
<td width="25%" align="left" style="color: #000000;text-align:left; border-left-style: solid; border-left-width: thin;
border-left-color: #ffffff;font-style:normal; font-weight:normal;padding:3px">
<b>City, St. Zip</b><br/> {!Account.BillingCity}, {!Account.BillingState} {!Account.BillingPostalCode} </td>
<td width="25%" align="left" style="color: #000000;text-align:left; border-right-style: solid; border-right-width: thin;
border-right-color: #ffffff;font-style:normal; font-weight:normal;padding-bottom:10px"><b>Email</b> {!Account.Primary_Field_POC__r.Email}
</td>
</tr>
<tr>
<td colspan="4" style="font-weight:bold ; border-style: solid; border-width:1px;
border-color: #000000;padding:3px;padding:3px;text-align:center;background-color:#B4C6E7">PER PUSH FEE SERVICE AGREEMENT</td>
</tr>
</table>
<table align="center" width="85%" style="font-family: Arial, Helvetica, sans-serif; text-align:left;"
cellpadding="4">
<tr>
<td width="50%" align="left" style="color: #000000;text-align:center; border-right-style: solid; border-right-width: thin;
border-right-color: #ffffff;font-style:normal; font-weight:normal;padding:3px">Per Push Fees: Includes all fees necessary to complete the services described in the scope of work for the event duration. Hourly pricing applies only to extra services.
</td>
</tr>
</table>
<table align="center" width="85%" style="font-family: Arial, Helvetica, sans-serif;text-align:center;" cellpadding="2">
<tr>
<td colspan="4" style="font-size:12px; font-weight: normal">
</td>
</tr>
<tr>
<td colspan="4" style="font-weight:bold ; border-style: solid; border-width:1px;
border-color:#000000;padding:3px;background-color:#B4C6E7;">
Service Locations and Fees
</td>
</tr>
<tr><td></td></tr>
</table>
<table align="center" width="85%" style="font-family: Arial, Helvetica, sans-serif; text-align:center;"
cellpadding="0">
<apex:repeat var="sd" value="{!bidsList}">
<apex:outputPanel layout="none" rendered="{!IF(sd.IsAddedToPDF__c =true ,true,false)}" style="vertical-align:central; font-family: Arial, Helvetica, sans-serif; text-align:center;width:85%">
<tr>
<th style="text-align:center;background-color:#0094DA;border-bottom-style:solid;border-bottom-width:1px;border-top-width:1px; border-top-style:solid">Site Name</th>
<th style="text-align:center;background-color:#0094DA;border-bottom-style:solid;border-bottom-width:1px;border-top-width:1px; border-top-style:solid">Service Period</th>
<th style="text-align:center;background-color:#0094DA;border-bottom-style:solid;border-bottom-width:1px;border-top-width:1px;border-top-style:solid">Address</th>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(sd.IsAddedToPDF__c =true ,true,false)}" style="vertical-align:central;font-family: Arial, Helvetica, sans-serif; text-align:center;width:85%">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2" ><apex:outputPanel rendered="{!IF(sd.IsAddedToPDF__c =true ,true,false)}"> {!sd.Customer__r.Name }</apex:outputPanel> </td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2" ><apex:outputPanel rendered="{!IF(sd.IsAddedToPDF__c =true ,true,false)}"> <apex:outputText value="{0, date, MMMM d',' yyyy}">
<apex:param value="{!sd.Customer__r.Contract_Start_Date__c}" /> </apex:outputText>Seasonal<apex:outputText value="{0, date, MMMM d',' yyyy}"><apex:param value="{!sd.Customer__r.Contract_End_Date__c}" /></apex:outputText>
</apex:outputPanel></td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2" ><apex:outputPanel rendered="{!IF(sd.IsAddedToPDF__c =true ,true,false)}">{!sd.Site__r.BillingStreet}<br/>{!sd.Site__r.BillingCity}, {!sd.Site__r.BillingState} {!sd.Site__r.BillingPostalCode} </apex:outputPanel></td>
</tr>
</apex:outputPanel>
<apex:repeat var="et" value="{!bidsMap[sd.Name] }" rendered="{!IF(sd.IsAddedToPDF__c =true ,true,false)}" >
<tr>
<th style="text-align:center;background-color:#28baff;border-bottom-style:solid;border-bottom-width:1px;border-top-width:0px; border-top-style:solid">Month</th>
<th style="text-align:center;background-color:#28baff;border-bottom-style:solid;border-bottom-width:1px;border-top-width:0px; border-top-style:solid"></th>
<th style="text-align:center;background-color:#28baff;border-bottom-style:solid;border-bottom-width:1px;border-top-width:0px; border-top-style:solid">Monthly Payment</th>
</tr>
<apex:outputPanel layout="none" rendered="{!IF(et.UOM__c ='Seasonal' ,true,false)}" style="vertical-align:central; font-family: Arial, Helvetica, sans-serif; text-align:center;width:85%">
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 1 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Jan-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 2 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Feb-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 3 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Mar-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 4 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Apr-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 5 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-May-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 6 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Jun-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 7 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Jul-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 8 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Aug-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 9 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Sep-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 10 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Oct-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText> </td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 11 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Nov-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.Number_of_Months__c >= 12 ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">10-Dec-20</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Monthly_Payment__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.UOM__c ='Seasonal' ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2">Retainer Fee</td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Retainer_Fee__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
<apex:outputPanel layout="none" rendered="{!IF(et.UOM__c ='Seasonal' ,true,false)}">
<tr>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:bold ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"></td>
<td style="font-weight:normal ; border-bottom-style:solid; border-bottom-width:1px;
color:#000000;padding:3px;text-align:center;background-color:#f2f2f2"><b>Total: </b><apex:outputText value="{0, Number, Currency}"><apex:param value="{!et.Total__c}" /> </apex:outputText></td>
</tr>
</apex:outputPanel>
</apex:outputPanel>
</apex:repeat>
</apex:repeat>
</table>
</html>
</form>
</apex:page>
Could you post the code of your apex class and screenshot of the output of vf page? That would help other to debug your issue.