You need to sign in to do that
Don't have an account?
Ed_Ingber
Inline CSS in Visual Workflow
Trying to modify the text formatting in the Screens by overriding a default setting of the CSS class. As an experiment, just trying to set text color to red. Found the class name using Chrome's Developer Tools. (Also modified the buttons, successfully based on an example given on the message board here.)
Text doesn't change to red - what am I missing?
Thanks!
Ed
<apex:page > <style type="text/css"> .bPageBlock .pbBottomButtons .pbButtonb .btn { color: #808080; display: inline; float: left; font: bold 16px arial, sans-serif; height: 24px; } </style> <p style="color: #808080; font-size: 175%; font-weight: bolder; margin-top: 0.3em; margin-bottom: 0.2em"> DH Interface Designer </p> <style type="text/css"> .theflow { color: #ff0000; } </style> <div id="theflow"> <flow:interview name="GP3_FLOW_9_1_12" buttonLocation="bottom" /> </div> </apex:page><apex:page > <style type="text/css"> .bPageBlock .pbBottomButtons .pbButtonb .btn { color: #808080; display: inline; float: left; font: bold 16px arial, sans-serif; height: 24px; } </style> <p style="color: #808080; font-size: 175%; font-weight: bolder; margin-top: 0.3em; margin-bottom: 0.2em"> DH Interface Designer </p> <style type="text/css"> .theflow { color: #ff0000; } </style> <div id="theflow"> <flow:interview name="GP3_FLOW_9_1_12" buttonLocation="bottom" /> </div> </apex:page>
I know the one thing I've seen work is encase the flow in a div with an id assigned to the div. Once you've done that, you can put CSS in the page assigned specifically to that div's id.
Thanks GetForcedQ, if I understand your suggestion...
I came across this post earlier that might shed some light on CSS if you have not already seen it:
Customizing a Flow’s User Interface
Use
<apex:page standardStylesheets="false">
<apex:page standardStylesheets="true" >
<style type="text/css">
.FlowText{
color: #fed;
font: bold 16px arial, sans-serif;
height: 24px;
}
.FlowCurrency{
color: #fed;
font: bold 16px arial, sans-serif;
height: 24px;
}
.FlowDropdown{
color: #fed;
font: bold 16px arial, sans-serif;
height: 24px;
}
</style>
<flow:interview name="New_Customer_Flow" id="theflow">
</flow:interview>
</apex:page>
However class definition like .FlowText .FlowCurrency .FlowDropdown{} won't work