CSS styling html table columns using <col />, cascade help

How do I style one column on my table to not have any borders?

I've been using the <col/> tag with an id so that I can style it with CSS. Example of my CSS:

#table td, th {
    vertical-align:middle;
    text-align:center;
    font-size:11px;
    border:1px solid #E0E0E0;
}
#col {
    width:300px;
    border:none !important;
}

The above should make every cell in #table have borders, while the !important declaration should override the cascade above. What am I doing wrong here?

I made the below by making every <td id="col"> and changing my col selector to td#col. I felt that this was a messy way to do things, I wanted better control over my table by not inserting an id tag into every 开发者_开发知识库td column.

---

See http://www.w3.org/TR/CSS21/tables.html#columns

You are not setting border-collapse property:

The various border properties apply to columns only if 'border-collapse' is set to 'collapse' on the table element.

Then, given:

In that case, borders set on columns and column groups are input to the conflict resolution algorithm that selects the border styles at every cell edge.

The borders on the two sides of the column will still impact:

Borders with a style of 'none' have the lowest priority. Only if the border properties of all the elements meeting at this edge are 'none' will the border be omitted (but note that 'none' is the default value for the border style.)

So you'll only end up removing the top and bottom borders of the affected cells.