Working With The Validation Checkbox Widget - Adobe 38040334 - Dreamweaver CS3 User Manual

Although you can easily edit rules for the Validation Select widget directly in the accompanying CSS file, you can
also use the CSS Styles panel to edit the widget's CSS. The CSS Styles panel is helpful for locating the CSS classes
assigned to different parts of the widget, especially if you use the panel's Current mode.
See also
"The CSS Styles panel in Current mode" on page 125
Style Validation Select widget error message text
By default, error messages for the Validation Select widget appear in red with a 1-pixel border surrounding the text.
❖
To change the text styling of Validation Select widget error messages, use the following table to locate the appro-
priate CSS rule, and then change the default properties, or add your own text styling properties and values:
Text to style
Error message text
Change Validation Select widget background colors
❖
To change the background colors of the Validation Select widget in various states, use the following table to locate
the appropriate CSS rule, and then change the default background color values:
Background color to change
Background color of widget in valid
state
Background color of widget in
invalid state
Background color of widget in focus .selectFocusState select,

Working with the Validation Checkbox widget

About the Validation Checkbox widget
A Spry Validation Checkbox widget is a check box or group of check boxes in an HTML form that display valid or
invalid states when the user selects or fails to select a check box. For example, you can add a Validation Checkbox
widget to a form in which a user might be required to make three selections. If the user fails to make all three selec-
tions, the widget returns a message stating that the minimum number of selections has not been met.
The following example shows a Validation Checkbox widget in various states:
Relevant CSS rule
.selectRequiredState .selectRe-
quiredMsg, .selectInvalidState
.selectInvalidMsg
Relevant CSS rule
.selectValidState select,
select.selectValidState
select.selectRequiredState, .selec-
tRequiredState select, select.select-
InvalidState, .selectInvalidState
select
select.selectFocusState
September 4, 2007
Relevant properties to change
color: #CC3333; border: 1px solid
#CC3333;
Relevant property to change
background-color: #B8F5B1;
background-color: #FF9F9F;
background-color: #FFFFCC;
DREAMWEAVER CS3 475
User Guide