css: set font-weight

Is it possible to set font-weight to normal without !important?

http://jsfiddle.net/DvBes/

<table id="tasks">
    <tr><td>Name</td><td>SomeTask</td></tr>
    <tr><开发者_运维技巧td>Time</td><td class="gray">08/11/2011</td></tr>
</table>



table#tasks td:first-child+td {
    font-weight:bold;
}

.gray {
    color: gray;
    font-weight: normal !important;
}

---

Your first css rule is much more specific than the second, because of this it will overwrite the second one if you don't use !important.

You could achieve the same without !important by changing .gray to table#tasks td:first-child+td.gray

---

The following code would do the trick:

#tasks .gray {
    color: gray;
    font-weight: normal;
}

You need to learn a bit about selector specificity, here's a good article http://css-tricks.com/855-specifics-on-css-specificity/ on it.

---

If you change your CSS:

.gray {
    color: gray;
    font-weight:normal;
}

to

table#tasks td:first-child+td.gray, .gray {
    color: gray;
    font-weight: normal;
}

---

Yes, give it greater specificity

table#tasks tr td.gray