+ Start a Discussion
Malik ButlerMalik Butler 

Styling vf page with static resource

I'm trying to style a vf page from a pdf that I made a static resource. I've added the code but nothing changed. Is there anything I can fix?

 
<apex:page standardController="Case" renderAs="pdf" applyBodyTag="true">
    <head>
        <style> 
           <apex:stylesheet value="{URLFOR(!$Resource.CasePDF)}"/>
            <apex:includeScript value="{!$Resource.CasePDF}"/>
        </style>
    </head>
    <body>
      <center>
        <h1>Service Work Order</h1>
       <h6>Integrated Precision Systems</h6>
<h6>9321 Ravenna Rd. Suite C. Twinsburg, OH 44087</h6>
       <h6><apex:outputText value="{!Case.CaseNumber}"/> <apex:outputText /></h6>
      </center>
         </body>
    <apex:form ><apex:inputTextarea richText="true"/></apex:form>  <body>
    <left><apex:outputText value="{!Case.Account.Name}"/> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Contact.Name}"/> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Phone__c}"/> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Address__c}"/> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Subject}"/> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Description}"/> </left>
    </body>
</apex:page>

 
Raj VakatiRaj Vakati
You have to use them  as class like below  in css classes 

https://trailhead.salesforce.com/en/content/learn/modules/visualforce_fundamentals/visualforce_static_resources  

 
<button class="ui-btn ui-shadow ui-corner-all
         ui-btn-icon-left ui-icon-action">action</button>
    <button class="ui-btn ui-shadow ui-corner-all
         ui-btn-icon-left ui-icon-star">star</button>

like below 
 
<apex:page standardController="Case" renderAs="pdf" applyBodyTag="true">
    <head>
        <style> 
           <apex:stylesheet value="{URLFOR(!$Resource.CasePDF)}"/>
            <apex:includeScript value="{!$Resource.CasePDF}"/>
        </style>
    </head>
    <body>
      <center>
        <h1>Service Work Order</h1>
       <h6>Integrated Precision Systems</h6>
<h6>9321 Ravenna Rd. Suite C. Twinsburg, OH 44087</h6>
       <h6><apex:outputText value="{!Case.CaseNumber}" styleClass="YOUR_CSS_CLASSNAME"/> <apex:outputText /></h6>
      </center>
         </body>
    <apex:form ><apex:inputTextarea richText="true"/></apex:form>  <body>
    <left><apex:outputText value="{!Case.Account.Name}" styleClass="YOUR_CSS_CLASSNAME"//> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Contact.Name}" styleClass="YOUR_CSS_CLASSNAME"//> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Phone__c}" styleClass="YOUR_CSS_CLASSNAME"/> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Address__c} styleClass="YOUR_CSS_CLASSNAME"/"/> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Subject}"/> </left>
    </body>
    <body>
    <left><apex:outputText value="{!Case.Description}"/> </left>
    </body>
</apex:page>

 
Malik ButlerMalik Butler
This doesn't seem to work.  think I am going to go a diffrent route and style it without the resource.