form-control-validator

The <form-control-validator> is a functional web component for normalizing the content and display of validation messages in an html form.

Use Pico.css

Example 1

An html <form> with native form control elements. This represents standard behaviour.

Username (user agent validation messages) Favourite Superhero

I have read the terms and conditions

Last time you ate noodles for breakfast

Example 2

An html <form> with native form control elements wrapped in <form-control-validator> web components.

Username (user agent validation messages)

Username (custom validation messages)

Username (user agent + custom validation messages)

Favourite Superhero

I have read the terms and conditions

Last time you ate noodles for breakfast