Selector pseudo-class :invalid

The :invalid CSS pseudo-class represents any

,
, or other element whose contents fail to validate. 
input:invalid {
  background-color: ivory;
  border: none;
  outline: 2px solid red;
  border-radius: 5px;
}