Is there any way to center certain columns in table?

Question

I'm widely using css formatting and define class for table with subclasses for thead, tbody, tfoot and another level of subclasses for tr, th, td....

In some cases I want to make whole column for table to have class with certain style... but don't know how to do that.

Is there any way (using HTML5, css3, anything else?) to make all cells in certain column of tbody to have the same class?

I can specify class explicitly (manually), but I would like to avoid that kind of duplication.

Any thoughts are welcome.

P.S. Probably I should not bother myself with that and just explicitly specify class for each cell?

Answer 1

You can use the nth-child css pseudo-selector to target the middle column of your table.

Example:

#myTable tr td:nth-child(3) {
  text-align: center;
}

This would target the 3rd column in a row, just adjust your X accordingly. It is also possible to use "n" as a variable for every nth child. Check out http://css-tricks.com/how-nth-child-works/ for a comprehensive example.

Answer 2

Have a look at the col and colgroup tags. They can be used to define columns. There are some restrictions on which styles apply though.

http://www.quirksmode.org/css/columns.html