CSS for Table not being applied right?

http://jsfiddle.net/RpCTx/4/

The table columns aren't changing to the width I specified. The second c开发者_如何学运维olumn is way to narrow...

css:

body{
    font-size: 11px;
    font-family: Calibri, Arial, Helvetica;
}
th {
     border-bottom: 1px solid black;   
}
.product_name, td {
    width: 132px;
}
.description, td + td {
    width: 290;
}
.quantity, td + td + td {
    width: 30px;
}
.list_upfronts, td + td + td + td {
    width: 77px;
}
.sales_price, td + td + td + td + td{
    width: 76px;
}

html:

<strong>
    <u>
        Starcraft, or something
    </u>
</strong>

<table id="integration_and_data_services">
    <tr>
        <th class="product_name">
            <b>Product Name</b>
        </th>
        <th class="description">
            <b>Description Information</b>
        </th>
        <th class="quantity">
            <b>QTY</b>
        </th>
        <th class="list_upfronts">
            <b>Upfronts</b>
       </th>
        <th class="sales_price">
            <b>Sales Price</b>
        </th>
    </tr>
    <tr>
        <td>Le Product name</td>
        <td>Lots of text here about whatever the product is about. Just needs to wrap to multiple lines.... Probably should be about starcraft... whatever.</td>
        <td>1.00</td>
        <td>$4500.00</td>
        <td>$4500.00</td>
    </tr>
</table>

---

You missed the px off your width declaration for the 2nd column:

.description, td + td {
    width: 290px;
}

Demo

---

Just have the width address each th

You do not need them in the tds. remove the td +...

Like so, http://jsfiddle.net/RpCTx/8/

---

There's a mistake in the rule: you lack the 'px'

This is correct:

.description, td + td {
    width: 290px;
}