Color text in pageblocktable based on checkbox

Question

I have a scenario to change color of text to red when a checkbox is true.

There are 3 columns in pageblock table(output field's).

The third coloumn is of type lookup and has a hyperlink to it, redirecting to that record.

Now the issue is color is changing fine for first two coluns but not for 3'rd column.

vf page:

<apex:pageBlockTable value="{!thevalue}" var="i">
                    <apex:column headerValue="Name">
                    <font color="{!if(i.checkbox,'#ff0000','#000000')}">
                    <apex:outputText value="{!i.name}"></apex:outputText>
                    </font>
                    </apex:column>
                    <apex:column headerValue="Date">
                    <font color="{!if(i.checkbox,'#ff0000','#000000')}">
                    <apex:outputField value="{!i.Date__c}"/>
                    </font>
                     </apex:column>
                    <apex:column headerValue="Location">
                    <font color="{!if(i.checkbox,'#ff0000','#000000')}">
                     <apex:outputfield value="{!i.Location__c}"/>
                     </font>
                    </apex:column>


                 </apex:pageblocktable>

Answer 1

The out-of-the-box style sheet for links is interfering with with the font's color attribute. Furthermore, apex:outputField doesn't seem to support style or styleClass correctly, despite being in the documentation. I could only get this working by actually creating the link directly:

<apex:outputLink value="{!URLFOR($Action.Location__c.View, i.Location__c, [id=i.Location__c])}"
                 style="color: {!if(i.checkbox,'#f00','#000')}">             
    {!i.Location__r.Name}
</outputLink>

Your mileage may vary.