sony sony -4 years ago 52
CSS Question

How to use CSS to style a descendant (not a direct child) of an element?

I am trying to override the style of a descendant (not the direct child) of an element using CSS.

Say, I am working on:

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


I want to override the style to set the valign of the tr element to "center".

I tried doing:

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


This doesn't work though. I assume table.z-hbox tr is looking up for a direct child
<tr>
which is not the case here. As
<tr>
is wrapped inside
<tbody>


How do I fix this?

Answer Source

The problem is not with the precedence. I figured out that it should be

vertical-align: middle instead of vertical-align: center

This works.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download