Apply colgroup class only to some rows

Question

I am trying to separate a group of columns with a border and I am having troubles to keep the headers and footers without that border.

Here's a fiddle with the example: http://jsfiddle.net/cgVHz/1/

As you can see, the two headers of the table also has a border, which is not what I'm looking for.

I am trying to overwrite the colgroup border but I don't get it working:

.demo{
    border-collapse: collapse; !important
}
.demo th{
    text-align:center;
    border-right:0px;
}
.demo colgroup{
    border-right: 1px solid #C4C4C4;
}

Is this possible? Thanks.

Answer 1

尝试将.demo colgroup更改为.demo td ，它可以正常工作。