Foros del Web » Creando para Internet » CSS »

Cambiar estilo al label con invalid y required

Estas en el tema de Cambiar estilo al label con invalid y required en el foro de CSS en Foros del Web. Hola a todos, He estado consultando el CSS que se puede tocar cuando al validar un formulario con campos required falta alguno por rellenar. El ...
  #1 (permalink)  
Antiguo 27/09/2016, 05:46
Avatar de majete  
Fecha de Ingreso: noviembre-2007
Mensajes: 96
Antigüedad: 16 años, 5 meses
Puntos: 2
Cambiar estilo al label con invalid y required

Hola a todos,
He estado consultando el CSS que se puede tocar cuando al validar un formulario con campos required falta alguno por rellenar. El caso es que utilizo radio buttons para las preguntas obligatorias, y no he visto ningún ejemplo para ello, tan sólo ejemplos para cambiar el aspecto de un textbox como este:

Código CSS:
Ver original
  1. input.a:invalid:required {
  2.     border:3px solid #ff0000;
  3.     }

Código HTML:
Ver original
  1. <tr>
  2. <td>Nombre</td>
  3. <td><input class="a" type="text" placeholder="nombre" required></td>
  4. </tr>

En mi caso cada elemento del formulario tiene este aspecto:

Código HTML:
Ver original
  1. <h4>Título</h4>
  2. <input type="radio" id="horas_a" name="horas" class="required" value="1">
  3. <label for="horas_a">Entre 0 y 2</label>
  4. <input type="radio" id="horas_b" name="horas" class="required" value="2">
  5. <label for="horas_a">Entre 2 y 4</label>
  6. etc...

Y me gustaría saber si puedo actuar sobre el título <h4> y no sobre el elemento input directamente. Me ha sido imposible con las pruebas que he realizado de momento.

Muchas Gracias!
Juan Carlos
  #2 (permalink)  
Antiguo 27/09/2016, 14:26
Avatar de AngelKrak  
Fecha de Ingreso: noviembre-2014
Mensajes: 917
Antigüedad: 9 años, 5 meses
Puntos: 91
Respuesta: Cambiar estilo al label con invalid y required

con css nose, creo que no, pero con js talvez si puedas hacerlo ;)
si no sabes, busca sobre jquery que es mas "facil"
  #3 (permalink)  
Antiguo 29/09/2016, 07:41
Avatar de majete  
Fecha de Ingreso: noviembre-2007
Mensajes: 96
Antigüedad: 16 años, 5 meses
Puntos: 2
Respuesta: Cambiar estilo al label con invalid y required

Bien, voy a buscar información a ver si encuentro algo parecido... saludos y gracias!
  #4 (permalink)  
Antiguo 30/09/2016, 15:56
 
Fecha de Ingreso: diciembre-2014
Ubicación: Madrid
Mensajes: 274
Antigüedad: 9 años, 4 meses
Puntos: 5
Respuesta: Cambiar estilo al label con invalid y required

Tu CSS mejor así: prueba

Código CSS:
Ver original
  1. .a:invalid, .a:required{
  2.     border:3px solid #ff0000;
  3.     }
__________________
Experto: aunque no sepas hacer algo, los novatos te pedimos que nos digas algo aunque sepas que no acertarás

Etiquetas: input, label
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:05.