The current implementation of scrollable dataTable does not allow the stying of the parent header table div. The elements that the component renders looks like the following:

<div>
   <div> // propose we add a style here.
       <table/> // header
    </div>
    <div>
        <table/> //body
    </div>
</div>

I'm hoping that we can add a style to the div that wraps the header table. This will allow for more flexible styling options when using scrollHeight attribute on dataTable.

Here are proposed style sheet entries for our themes.
rime.css
.iceDatTblScrlSpr{
    background: url( './css-images/table_col_header.gif' ) repeat-x bottom left;
    border-top: 1px solid #d9d9d9;
    border-right: 1px solid #d9d9d9;
}
royal.css
.iceDatTblScrlSpr{
    background: url( './css-images/table_col_header.gif' ) repeat-x top left;
    border-top: 1px solid #026AFF;
    border-right: 1px solid #026AFF;
}
xp.css
.iceDatTblScrlSpr{
    background: url( './css-images/table_col_header.gif' ) repeat-x bottom left;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
}