renderas=pdf not generating borders in html tables
The solution for this is to wrap the style tag in head tag.
Include tag before tag
<apex:page standardController="Invoice__c" extensions="PageControllera" showheader="false" sidebar="false" renderAs="pdf" >
<head>
<style>
table.gridtable {
font-family: verdana,arial,sans-serif;
font-size:11px;
color:#333333;
border-width: 1px;
border-color: #666666;
}
table.gridtable th {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #666666;
font-weight:bold;
}
table.gridtable td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #666666;
background-color: #ffffff;
}
</style>
</head>
<table Id="header" style="width: 100%; " border ="1">
<tr>
<td style="width: 50%"><apex:image value="{!URLFOR($Resource.Logo)}"/><br/><br/>
</td>
<td style="width: 50%;" >
<table Class = "gridtable" > // This table does not display borders
<tr>
<th>Date</th>
<th>Invoice #</th>
</tr>
<tr>
<td> <apex:outputText value="{0,date,MM/dd/yyyy}" >
<apex:param value="{!DATEVALUE(text(theInvoice.Actual_Date__c))}"/>
</apex:outputText></td>
<td><apex:outputText value="{!theInvoice.Name}" /></td>
</tr>
</table><br/>
<table Class = "gridtable" cellpadding="1" cellspacing = "1" >
<tr >
<th>P.O. No. </th>
<th>Terms</th>
<th>Project</th>
</tr>
<tr>
<td> </td>
<td>Net 60</td>
<td></td>
</tr>
</table>
</td>
</tr>
<tr >
<td >
<table Class = "gridtable" cellpadding="2" cellspacing = "2">
<tr>
<th>Bill To</th>
</tr>
<tr>
<td> <apex:outputText value="{!theInvoice.Account_Name__r.Name}" /> <br/>
<apex:outputText value="{!theInvoice.Account_Name__r.BillingStreet}" /><br/>
<apex:outputText value="{!theInvoice.Account_Name__r.BillingCity}" /><br/>
<apex:outputText value="{!theInvoice.Account_Name__r.BillingState}" /><br/>
<apex:outputText value="{!theInvoice.Account_Name__r.BillingCountry}" /><br/>
<apex:outputText value="{!theInvoice.Account_Name__r.BillingPostalCode}" />
</td>
</tr>
</table>
</td>
<td > </td>
</tr>
</table>
</apex:page>
This works for me very well. As @MohithKumar has already said you need to wrap your <style> ...</style>
with a <head>...</head>
tag:
<apex:page showheader="false" sidebar="false" renderAs="pdf">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<style>
.redLine {
border-bottom: 2px solid #CB5D5D;
}
</style>
</head>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2" class="redLine">Hello World</td>
</tr>
</table>
</apex:page>
Result:
@Mitesh Sura
add padding:1px to your style. This should resolve your issue.