5

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?

steveax
  • 17,527
  • 6
  • 44
  • 59
Budda
  • 18,015
  • 33
  • 124
  • 206
  • possible duplicate of [Is it possible to globally text-align a table column without specifying a class in each row?](http://stackoverflow.com/questions/10201267/is-it-possible-to-globally-text-align-a-table-column-without-specifying-a-class) – Jukka K. Korpela Apr 21 '12 at 04:24

2 Answers2

7

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.

mensor
  • 190
  • 8
  • Created a simple prototype that doesn't work for me... Should I use some special document type? Please advise if you know "usual common mistake". If no, will create a separate question (as I can't find an answer)... :( – Budda Apr 23 '12 at 23:10
  • http://stackoverflow.com/questions/10342168/difficulties-with-appliance-of-nth-of-child-to-table-cells - question with details of the problem to use the suggested approach. Please advise if you have any ideas what causes the problem in my case. Thanks a lot! – Budda Apr 26 '12 at 22:15
  • 1
    Hi Mensor, if you change the "nth-of-child" to "nth-child" I will accept that as an answer. Thanks. – Budda Apr 26 '12 at 22:35
  • 1
    @Budda I just changed it...sorry, must have been thinking about something when I put in "-of" – mensor Apr 27 '12 at 18:09
1

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

James Montagne
  • 77,516
  • 14
  • 110
  • 130
  • @Budda I'm fairly certain that's not true. – James Montagne Apr 21 '12 at 05:28
  • Here (http://stackoverflow.com/questions/10289494/why-colgroup-col-doesnt-work-in-chrome) is a demonstration it doesn't work. Please assist if you know the solution. Thank you very much in advance – Budda Apr 23 '12 at 23:11
  • Have a look at the restrictions section of the link I provided. – James Montagne Apr 24 '12 at 00:24
  • Oh, now I see now. But then, colgroup/col can't be used for centering columns content (that was my question). – Budda Apr 26 '12 at 02:50
  • Now that you mention it I do see that in the title of your question, didn't actually put it in the body of the question anywhere. It cannot be used for centering except in old versions of IE. – James Montagne Apr 26 '12 at 03:29