+ Start a Discussion
Rick SF AdminRick SF Admin 

How to create two columns with signature lines on Visualforce Page rendered as PDF

How can I create the exact image below on my visualforce page rendered as PDF? "ABC INDUSTRIES, INC." will autopopulate from the Account Name of the record from the custom object, however I would like the account name to appear bold and in ALL CAPS as seen in the image.

User-added image
Best Answer chosen by Rick SF Admin
Aslam ChaudharyAslam Chaudhary
Hint: Please use <Table> <tr> <td> for exact layout.

Let me know if you still need complete code.

All Answers

Aslam ChaudharyAslam Chaudhary
<b style="text-transform: uppercase;" >{!test}</b>

Hope this will work..
Rick SF AdminRick SF Admin
Hello Aslam. That did work for the company name in all CAPS. Thanks. But I'm also trying to recreate the exact layout that is seen in the image that I posted on my VF PDF page 
Aslam ChaudharyAslam Chaudhary
Hint: Please use <Table> <tr> <td> for exact layout.

Let me know if you still need complete code.
This was selected as the best answer
Rick SF AdminRick SF Admin
Yes I need the code please. Thanks you
Rick SF AdminRick SF Admin
I figured it out. Thanks!
Aslam ChaudharyAslam Chaudhary
Thats Coool. Happy Coding!!
Rick SF AdminRick SF Admin
I'm having an issue with spacing and alignment now. How can I have them equally spaced apart top and bottom and still be aligned. I'm using
<br/> but it throws everything off. 

User-added image

 
Rick SF AdminRick SF Admin
Here is the code I'm using....

<table cellpadding="6" width="100%">
        
    <tr>          
            <td>
                <b style="text-transform: uppercase;" >{!Demo__c.Account__r.Name}</b> 
            </td>
            <td>
                <b style="text-transform: uppercase;" >Demo, Inc.</b> 
            </td>
        </tr>
      
        <tr>          
            <td>
                <apex:outputText value=" Sign:    ______________________________"/> 
            </td>           
            <td>
                <apex:outputText value=" Sign:    ______________________________"/> 
            </td>
        </tr>
<br/>
<br/>   
        <tr>          
            <td>
                <apex:outputText value=" Name:    _____________________________"/> 
            </td>
            <td>
                <apex:outputText value=" Name:    _____________________________"/> 
            </td>
        </tr>
<br/>
<br/>    
        <tr>          
            <td>
                <apex:outputText value=" Title:    ______________________________"/> 
            </td>
            <td>
                <apex:outputText value=" Title:    ______________________________"/> 
            </td>
        </tr>
<br/>
<br/>    
        <tr>          
            <td>
                <apex:outputText value=" Date:    ______________________________"/> 
            </td>
            <td>
                <apex:outputText value=" Date:    ______________________________"/> 
            </td>
        </tr>    
    </table>

 
Aslam ChaudharyAslam Chaudhary
<html>
<body>
<table >
        
    <tr >          
            <td  width="150px" height="50px">
                <b style="text-transform: uppercase;" >AccountName</b> 
            </td>
            <td width="150px" height="50px">
                <b style="text-transform: uppercase;" >Demo, Inc.</b> 
            </td>
        </tr>
      
        <tr>          
            <td width="150px" height="20px">
                <input type="text" value=" Sign:    ______________________________"/> 
            </td>           
            <td width="150px" height="20px">
                <input type="text"  value=" Sign:    ______________________________"/> 
            </td>
        </tr>
  
        <tr>          
            <td width="150px" height="20px">
                <input type="text"  value=" Name:    _____________________________"/> 
            </td>
            <td width="150px" height="20px">
                <input type="text"  value=" Name:    _____________________________"/> 
            </td>
        </tr>
        <tr>          
            <td width="150px" height="20px">
                <input type="text"  value=" Title:    ______________________________"/> 
            </td>
            <td width="150px" height="20px">
                <input type="text"  value=" Title:    ______________________________"/> 
            </td>
        </tr>
        <tr>          
            <td width="150px" height="20px">
                <input type="text"  value=" Date:    ______________________________"/> 
            </td>
            <td width="150px" height="20px">
                <input type="text"  value=" Date:    ______________________________"/> 
            </td>
        </tr>    
    </table>
	</body>
	</html>

Change the height and width as per your requirement. I have changed the VF control to normal html control.