JavaFX Subclass pseudoclass - css

Question

I wan to make 2 different styles of button in one css. So when creating the second button i added class to it using:
close.getStyleClass().add("close-button");
so now i can reference this button in css by:
.button.close-button
But now i dont know how to reference pseudoclasses of button when using the .close-button class.
I tried accessing it by
.button.close-button:selected
or
.button:selected.close-button
Nor of these seems to work. Is there any way how to do it? Or do i have to create my own pseudoclasses for the .close-button class and add and remove them in listeners of the btton in code?
I am creating the button using:
Button close = new Button("X");
close.getStyleClass().add("close-button");
close.setOnAction((event) -> {
....
});
Than i am adding it to the layout:
HBox hbox = new HBox(rbSelect, label, pane, close);
my css looks like:
.button {
...
}
.button.close-button {
-fx-background-color: #E81123;
}
.button:selected.close-button {
-fx-background-color: greenyellow;
}
The button looks like this:
When i click on it:
Seems like nothing happens, when i would expect the button to change color to greenyellow

Answer 1

I'm not 100% sure this is necessary, but by convention the pseudo class selector is added after the class selectors:
.button.close-button:selected {
-fx-background-color: greenyellow;
}
However there is no selected pseudo class for Button. It's available for CheckBox and ToggleButton, but not for regular Buttons. Pseudoclasses that are available are :pressed and :hover, see css reference.
You could of course add the pseudoclass yourself, assuming you're using JavaFX 8:
PseudoClass selected = PseudoClass.getPseudoClass("selected");
close.setOnAction((event) -> {
....
close.pseudoClassStateChanged(selected, true);
});