Making errors on forms look much better

You could control the css classes through properties on the form. If you have access to the code of the page, you can actually set the fielderrorcssclass through a property on the form. Then you could control the styling on your own. Or you could override their css class for the errorlabel.

I made my own form controls that utilize both html5 validation (mostly for the css selectors :valid and :invalid) and asp.net client side validation. I added a RequiredFieldValidator and RegularExpressionValidator to my form control to handle validation according to the rules in the form settings.

I also added the label to the form control so I can show/hide the required mark.

This is the code from my text box controls, which I added at the end of the OnLoad method:

var fieldInfo = this.FieldInfo;

Label.Text = fieldInfo.Caption;

if (!fieldInfo.AllowEmpty)
{
    var errorMessage = fieldInfo.GetPropertyValue(FormFieldPropertyEnum.ValidationErrorMessage);
    Label.ShowRequiredMark = true;
    rfvTextbox.Text = string.IsNullOrEmpty(errorMessage) ? "This field is required" : errorMessage; ;
    rfvTextbox.Enabled = true;
    textbox.Attributes.Add("required", string.Empty);
}
else
{
    rfvTextbox.Enabled = false;
}
if (fieldInfo.FieldMacroRules.Any())
{
    var macroRule = fieldInfo.FieldMacroRules.First();

    if (!string.IsNullOrEmpty(fieldInfo.RegularExpression))
    {
        var actual = Regex.Unescape(fieldInfo.RegularExpression);

        textbox.Attributes.Add("pattern", actual);
        revTextbox.ValidationExpression = actual;
        revTextbox.ErrorMessage = string.IsNullOrEmpty(macroRule.ErrorMessage) ? fieldInfo.GetPropertyValue(FormFieldPropertyEnum.ValidationErrorMessage) : macroRule.ErrorMessage;
    }
}
else
{
    revTextbox.Enabled = false;
}