How to style Java FX TableView column header using CSS

Question

I am rather new to JavaFX and CSS styling (and also stackoverflow). I am wondering how can one style the table header of the column. This is what my header looks like currently: Current styling of my table view column header

This is what I want it to look like: Styling I want to implement

I have tried applying the following css styling without avail:

.table-view .column-header .nested-column-header
{
    -fx-background-color: #AAAAAA;
    -fx-background-radius: 0;
    -fx-background-insets: 0;
    -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.6), 2, 0.5, 1, 1);
}

.table-view .column-header
{
    -fx-background-color: #AAAAAA;
    -fx-background-radius: 0;
    -fx-background-insets: 0;
    -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.6), 2, 0.5, 1, 1);
}

.table-view .column-header .filter
{
    -fx-background-color: #AAAAAA;
    -fx-background-radius: 0;
    -fx-background-insets: 0;
    -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.6), 2, 0.5, 1, 1);
}

I also checked out the caspian.css file found in the jfxrt.jar but that could not point me in the right direction.

So if anyone has any ideas, it would be great. :) Thank you in advance.

Answer 1

I would recommend to try something with the following style classes:

.table-view .column-header-background

I changed my column header background with this css and it worked:

.table-view .column-header,
.table-view .column-header .filler,
.table-view .column-header-background .filler {
    -fx-background-color: red;
}

Are you sure that you dont have a treetable? Because the styling class is named tree-table-view instead of table-view.