Cómo utilizar CSS para el estilo descendiente (no es un hijo directo) de un elemento?

StackOverflow https://stackoverflow.com/questions/3791594

  •  05-10-2019
  •  | 
  •  

Pregunta

Estoy tratando de anular el estilo de un descendiente (no el niño directa) de un elemento con CSS.

Say, estoy trabajando en: 

<table id="z_d__h3-real" class="z-hbox">
 <tbody>
   <tr valign="top">
   -----
   </tr>
  </tbody>
</table>

Quiero anular el estilo para establecer el valign del elemento tr a "centro".

He intentado hacer: 

table.z-hbox tr {
    vertical-align:center;
}

Esto no funciona sin embargo. Asumo table.z-hbox tr está mirando hacia arriba para un niño <tr> directa que no es el caso aquí. Como <tr> se envuelve dentro de <tbody>

¿Cómo puedo solucionar esto?

¿Fue útil?

Solución 3

El problema no es con la precedencia. Me di cuenta de que debería ser

vertical-align: medio en lugar de vertical-align: centro

Estos trabajos.

Otros consejos

Estilos en línea tienen mayor prioridad que los que se definen en las etiquetas o una hoja de estilo incluyen. O bien quitar el atributo valign="top" (que está en desuso en las nuevas versiones del estándar HTML de todos modos), o, si no se puede cambiar el marcado, marque la regla CSS como !important. El selector en sí es bueno (se puede probar esto mediante la adición de otras normas).

Su CSS está bien. Los espacios en blanco entre selectores selecciona los descendientes, sería necesario > para niños directos.

Su problema es que el atributo de línea tiene prioridad sobre el estilo en la hoja de estilo. Usted podría tratar de usar !important, pero no sé cómo funciona la honestidad de precedencia con atributos HTML en desuso. Yo nunca uso de ellos.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top