CSS styling guide

Created by Alison Gianotto, Modified on Fri, 5 Feb, 2021 at 3:55 PM by Alison Gianotto

You can use standard CSS validation classes to control the display of valid and invalid form elements - such as:

/* Selects any valid <input> */
input:valid {
  background-color: powderblue;
}

/* Selects any invalid <input> */
input:invalid {
  background-color: pink;
}

(From the excellent documentation at https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation)