Question

Hi I have a generic DIV with a Css Role applied.

I would like to know if CSS allows to set the style for an HTML Tag inside a DIV (only for DIV with that Role) which has a Css Role.

Please let me know your thoughts. Thanks for your time on this.

   <div class="Role">
    <table></table>
    </div>

    .Role
    {
    // Style for <table> tag.
    }

Answer 1

You have several options to go:

• The descendant selector selector .Role table, for example, select for apply all the table that are contained into an element, whatever, with class Role.

• The child selector .Role > table will apply the associated rules to the tables that are child (not descendant) of the element with class Role

For example, consider this html fragment:

<div class="Role">
    <table id="t1">
      <tr><td>
        <table id="t2">
          ....
        </table>
      </td></tr>
    </table>
    </div>

• .Role table will apply the css rule to table#t1 and table#t2
• .Role > table will apply the css rule to table#t1 only
• .Role > table table will apply the rule to table#t2 skipping to table#t1