ASP.Net Validator Default Style

Question

I'm using several variants of the Validator controls (RequiredFieldValidator, CompareValidator, etc) and am using the CssClass property of the validator. I can see (via Firebug) that the class is being applied, but the validator control itself is adding a style element to it, namely color: red. But I don't want that. I want the control to use the cssclass only.

I know I can override the Forecolor attribute, but I'll have to do that on every validator in the project. And I'd really like to be able to just change my CSS Class in my stylesheet in case we have to change all the error message appearances in the future.

Anyone have any clues how to tell the Validator controls to NOT use their default styles?

Answer 1

You can change the default style of validators using Themes.

• Right click on the website in Visual Studio
• Choose "Add ASP.NET Folder"
• Choose "Themes", name the new folder "DefaultTheme"
• Create a file called "Controls.skin" in the DefaultTheme folder

Add the following to the Controls.skin file:

<asp:RequiredFieldValidator runat="server" CssClass="validation-error" />
<asp:RangeValidator runat="server" CssClass="validation-error" />
<asp:CompareValidator runat="server" CssClass="validation-error" />
<asp:RegularExpressionValidator runat="server" CssClass="validation-error" />
<asp:CustomValidator runat="server" CssClass="validation-error" />
<asp:ValidationSummary runat="server" CssClass="validation-error" />

Merge the following into your web.config:

<configuration>
    <system.web>
        <pages theme="DefaultTheme" />
    </system.web>
</configuration>

Then you can set whatever colour you want for .validation-error in your CSS files.

(Note that versions of ASP.Net before 4.0 used to apply style="Color:red" to all validators by default, making it hard to override their colours in CSS. If you find that is affecting you, then you can override it by setting the ForeColor property on each of the theme elements above, or add !important to your CSS rule.)

See:

• How to: Define ASP.NET Page Themes
• How to: Apply ASP.NET Themes
• Validation Controls Lost Their Red Color in ASP.Net 4.0