Ver Mensaje Individual
  #7 (permalink)  
Antiguo 24/02/2014, 12:15
Zeromm
 
Fecha de Ingreso: julio-2010
Ubicación: A Coruña
Mensajes: 505
Antigüedad: 13 años, 9 meses
Puntos: 60
Respuesta: clases en div's anidados

Cita:
Iniciado por pzin Ver Mensaje


La respuesta de Rafael es correcta. El selector > no selecciona "al primer hijo", sino a todos los hijos. Pero sólo a los hijos, ningún otro elemento descendiente.

Para seleccionar a primeros elementos hay que usar :first-of-type o :first-child.
No es por discutir, pero no es correcta, y aquí puedes comprobarlo.

http://codepen.io/zeromm/pen/qcngv

No funciona, y es lógico, ya que de esta forma solo le dice que el hijo de ".datos_tabla" tenga un estilo... pero luego aplicandole estilos a ".info_tabla h1" le estás dando estilos al mismo h1, por eso se sobreescriben.

Pero en cambio si le indicas, como dije, ".info_tabla > h1", selecciona solo los h1 que sean hijos directos de .info_tabla, que no es el caso del <h1> que está dentro de ".datos_tabla" que no es hijo directo de ".info_tabla". Y así si funciona

http://codepen.io/zeromm/pen/kxbgq

Y en este caso sería totalmente innecesario añadir un ":first-of-type" o ":first-child", que además no son compatibles con ie8 sin librerias externas, ya que con un simple selector ">" que si es compatible con esas versiones queda solucionado.
__________________
http://zeromm.es/
Diseñador Web | Experto en Responsive Design, CSS3 y Optimización Web.

Última edición por Zeromm; 24/02/2014 a las 12:20