html - CSS specific table

Question

I have an HTML document where I have two different tables. One is class Alpha and one is class Beta. I want to assign this css to class Beta only...

td
{
border-style:solid;
border-top:thick double #ff0000;
}

I can not figure out how to assign this only to Beta. Does anyone know how?

question from:https://stackoverflow.com/questions/11286897/css-specific-table

Answer 1

Just apply the .beta class selector to the entire table and change your CSS code to apply a rule only to td decedents of .beta like this:

<table class="beta">
    <tr>
        <td>...</td>
        <td>...</td>
    </tr>
</table>

.beta td {
    border-style:solid;
    border-top:thick double #ff0000;
}

If you need to apply the rule to multiple elements within .beta simply add an additional selector like this:

.beta td, 
.beta th {
    border-style:solid;
    border-top:thick double #ff0000;
}

Qapla'!