Himas Rafeek
Posted on: 1 year ago
CSS

CSS3 validation

CSS for form field validation


                                          // the :invalid form field will display the following behaviorinput:invalid {
    border-bottom: 2px solid #FC625D;
}
 // This is a special CSS target I like to use// to show only that the field in invalid when the user // focuses on this specific fieldinput:focus:invalid {
    ~ .form-hint {
        display: inline-block;
    }
}
 // And now for a positive feedback validationinput:valid {
    border-bottom: 2px solid #35CE4A;
       + .glyphicon {
        display: inline;
    }
}