0

Changing the background color of a pageBlockSection. I can do this with a local style but not using a CSS file as a static resource (preferred.) I'm sure this is an obvious fix but can't seem to get it working with a static resource file. Any ideas ?

Using a static resource file:

.headerstyle2 body .bPageBlock .pbBody .yellow .pbSubheader{
    background-color:yellow;
}

Using a local style

<style>
  body .bPageBlock .pbBody .yellow .pbSubheader{
  background-color:yellow;
  }
</style>

Using an outputPanel (works) with the style:

  ....
<apex:stylesheet value="{!URLFOR($Resource.pdfcssresource, 'CREresource_CRE.css')}"/> 
....
    <apex:actionRegion >
    <apex:outputPanel styleClass="yellow" layout="block">
     <apex:pageBlockSection columns="1" id="section2a" title="Submission Summary Information (Pending Data Def -Reinstatements) " showHeader="true" rendered="{!NOT(submissionList.size == 0)}" >
     </apex:pageBlockSection>
    </apex:outputPanel>
    </apex:actionRegion>

Using a StaticResource file (not working) as styleclass:

  ....
<apex:stylesheet value="{!URLFOR($Resource.pdfcssresource, 'CREresource_CRE.css')}"/> 
....
<apex:actionRegion >
<apex:outputPanel styleClass="headerstyle2" layout="block">
 <apex:pageBlockSection columns="1" id="section2a" title="Submission Summary Information (Pending Data Def -Reinstatements) " showHeader="true" rendered="{!NOT(submissionList.size == 0)}" 
 </apex:pageBlockSection>
</apex:outputPanel>
</apex:actionRegion>
  • Have you tried inspecting the element? Its likely that the css class is overwritten by some other css properties. Although I don't really have an explanation for why it does work when you have local css class – d_k May 3 '17 at 2:41
  • Didn't see anything. I'm sure there's a syntax issue in the static resource. Hoping a second set of eyes will help. – rickmac May 3 '17 at 2:46
  • Looks like @d_k is correct, there must be some other class overriding your changes. Best you could do is add !important to your css property in static resource and it will not be overridden. – Salesforcesmarty May 3 '17 at 3:54
  • @rickmac I'd recommend you to check your console when you load the page, this will help you identify if there is anything wrong with your syntax when loading static resource in most cases it does show an error, if the file wasn't loaded. – d_k May 3 '17 at 4:04
0

This format in the static resource worked.

.bPageBlock .pbBody .header1 .pbSubheader{
             background-color:lightgreen;
         }
.bPageBlock .pbBody .header1 .pbSubheader h3{
             color:grey;
         }
.bPageBlock .pbBody .header2 .pbSubheader{
             background-color:lightblue;
         }
.bPageBlock .pbBody .header2 .pbSubheader h3{
             color:grey;
         }   

<apex:outputPanel layout="block" styleClass="header1" >
 <apex:pageBlockSection columns="1" id="section2a" title="Submission Summary Information (Pending Data Def -Reinstatements) " showHeader="true" rendered="{!NOT(submissionList.size == 0)}" >
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.