Slaw suggestion is good, but I would suggest another way using validation.
Note that this method requires ControlsFX library and some code in your controller (can't be done in css as you mentioned).
In your controller class create a validator:
ValidationSupport validationSupport = new ValidationSupport();
Add validation (as a required field) to your node (TextField in this example) inside initialize method:
validationSupport.registerValidator(myTextField, Validator.createEmptyValidator("Field is required"));
Now when you run your application the required TextField will look like this:
If the focus is lost from TextField and it doesn't have any text in it, it will show a red X like this:
Yep, Slaw's suggestion is very straight forward and works a treat. Your suggestion sounds interesting. I will give it a go and let you now how I get on.
I tried this and I only managed to get it to partially work. While I get the little red triangle in the top LH corner I do not get the red "X" when the textfield loses focus. I tried even adding a severity to the validator, but just the same. I copied and pasted the code you gave and just swapped "myTextField" for the textfield name of the control I am using ("tfFirstName"). Also, I am assuming that the message is displayed to the user as a tooltip or the like when the textfield loses focus.
@yazterfari if you type something, and delete it, then it triggers the X if TextField is empty. Message is displayed when you hover over X sign.
Nice! Thanks for that.