Tengo este formulario
Código HTML:
<label class="tituloform" for="Usuario">Usuario</label></td><td align="left">
<input type="text" name="Usuario" id="User" class="validacion fallovalidacion" value=""></td></tr><tr class="reg-tr"><td align="left">
<label class="tituloform" for="email">Email</label></td><td align="left">
<input type="text" onkeypress="" name="email" class="validacion fallovalidacion" id="email" value=""></td></tr>
<tr class="reg-tr"><td align="left">
<label class="tituloform" for="contra">Contraseña</label></td><td align="left">
<input type="contra" name="contra" class="validacion fallovalidacion" id="contra"></td></tr>
Las clases de cada input
Código CSS:
Ver original.validacion{
width: 220px;
box-shadow: 0 1px 1px #e6e6e6;
}
.fallovalidacion{
background-color: #fcf1f1;
border: solid 1px #e8270d;
}
La clase validacion es un simple borde azul cuando el usuario hace click en el input para escribir el usuario o la contraseña.
La clase fallovalidacion es un borde rojo al input para mostrar al usuario que hace falta ese campo, ya que no puede registrarse sin contraseña.
como puedo programar ese error que tengo que mostrarle al usuario?
Gracias.