Can HTML tags inherit the class of a parent/enclosing tag?

Question

Is there a way to specifically style only the tags inside a wrapping tag? For example, I want to style only <td> within tables of class "wide".

HTML:

<table class="wide">
<tr>
<td>Entry 1</td>
<td>Entry 2</td>
</tr>
<tr>
...
</tr>
</table>

CSS (or something along these lines):

td.wide {
    /* styling */
}

I want to have all the <td> elements for "wide" tables styled but a table like <table class="small"> ... </table> would not have its <td> elements styled. I would like to avoid adding class="wide" to every <td> element in all the wide tables.

Note: I'm not looking to do this specifically for <table> and <td> elements. I'd like to know the proper way to do this in general. The example could be styling all <p> elements enclosed in a <div> of a certain class.

Answer 1

Can HTML tags inherit the class of a parent/enclosing tag?

No. Classes are not inherited.

Is there a way to specifically style only the tags inside a wrapping tag?

A descendant combinator

selector-of-container [space] selector-of-target-within-container

I would like to avoid adding class="wide" to every <td> element in all the wide tables.

table.wide td { /* rules */ }

Answer 2

This is basic CSS.

Your table has a class of .wide and you want to style the td elements within it.

.wide td {
yourstyles;
}