Stop Using :invalid and :valid Pseudo-Classes. Use THIS Instead!
A quick tip showcasing why you should use :invalid and :valid CSS pseudo-classes on your input fields.
A quick tip showcasing a better way to handle inline form validation using CSS than resorting to JavaScript or CSS hacks, such as input:not(:placeholder-shown):invalid {}.
Instead of :invalid and :valid CSS pseudo-classes on your input fields, use :user-invalid and :user-valid CSS pseudo-classes, which only trigger when the user interacts with the input field.
