How to change the color of indicator

Question

How can we show indicator for required field in VF page, There is always a red indicator , I want to have some other color indicator against the fields, I am using outputfield to show the values and not successful to show any kind of indicator except having onemore field outputtext but it seems not working for me

Example :

   <script>
    .myRequired {background-color: #CC0000;margin-right: 2px;display: inline;width: 3px;float: left;}
    </script>
    <apex:form>
      <apex:inlineeditsupport ShowOnEdit="save,cancel" event="ondblclick">
      <apex:pageblock>
        <apex:pageBlockSection columns="2">

         <apex:outputfield value="{!Account.NaicsCode}" styleclass="myRequired"/> 
<apex:outputfield value="{!Account.NaicsDesc}" styleclass="myRequired"/
</apex:pageBlockSection>
</apex:pageblock>
    <apex:form>

It does not show that red bar beside outputfield as it is inline editing, I cannot use the inputfield.

If I use outputtext then it does show the red bar.

How to get red required field indicator to show when using inline edit support?

I have referred the following link but it does not solve the issue of having a required indicator for outputfield

Answer 1

With a bit of css and the proper tag: Example below

<apex:page standardController="Account">
<style>
.requiredBlock{
    background-color: yellow !important;
}
</style>

<apex:form >
<apex:pageblock >
<apex:pageblocksection >
<apex:inputField value="{!account.name}"/>
</apex:pageblockSection>
</apex:pageblock>
</apex:form>


</apex:page>

Of course if you get more specific with your selectors you may not need the !important flag