CSS table column rules

Question

Is there a CSS shorthand which I can use to exclude a table's first and second column from this rule?

th.header {
        background-image: url(../static/images/bg.gif);
        background-repeat: no-repeat;
        background-position: right center;
    }

I think I need the column equivalent of something like: tr:not(.firstrow) .

Answer 1

If the cells in question do not span more than one column (ie do not have a colspan that isn't 1), you can use :nth-child() .

You can either exclude each column individually:

th.header:not(:nth-child(1)):not(:nth-child(2)) {
    background-image: url(../static/images/bg.gif);
    background-repeat: no-repeat;
    background-position: right center;
}

Or, if the columns to exclude are consecutive and you want to start from, say, the third column, use :nth-child() with the formula n+b where b is the column you want to start with:

th.header:nth-child(n+3) {
    background-image: url(../static/images/bg.gif);
    background-repeat: no-repeat;
    background-position: right center;
}