DataTable header colors

Question

Is there any way to set the header colors for individual columns vs. setting the color for the entire header?

Answer 1

I wrote up the solution for this and was about to post when I decided I'd better try it. Then I found it doesn't work; there's a bug in the JSF Data Table which causes the columnClasses property to not apply to the cells in the header section. (If you look at the rendered html page, you can see each <td> is assigned an item from the columnClasses list, but this is not the case for the <th>'s.). Or alternatively, the JSF data table authors did this deliberately, but failed to provide a style list property for the header; the "headerClass" property is not an iterator like rowClasses/columnClasses.
Thus, the solution I was going to suggest doesn't work for the data table.
With that fixed, the solution would have been this:
You should use the columnClasses property on the data table. (See this blog entry for more information on how that works:
http://blogs.sun.com/roller/page/tor/20041004#aligning_text_in_tables)
Note however that this will set the styleclass properties for the columns on every ROW in the table, not just in the header.
So assuming your columnClasses property for your three-column table was this: "col1,col2,col3"
you should put rules like this in the stylesheet:
thead .col1 { background-color: orange }
thead .col2 { background-color: indigo }
thead .col3 { background-color: lime }
In other words, you're writing rules for the case where there's a col1 class on an element within a <thead>.
-- Tor
http://blogs.sun.com/tor