Debugging CSS

[Tom Eugelink]

I'm pushing the envelope a bit -I think- concerning the use of CSS. I have setup a control (gauge) in such a way that, depending on the position of the needle, certain CSS classes are added or removed from the control. For example a "errorSegment-active" class if the value comes into the 90-100 value in a 0-100 gauge. In this class a CSS variable -fx-error-indicator-visibility is set to "visible" and that again shows some kind of indicator on the gauge. Works great.

What is strange is when this class is assigned to the control, a totally unrelated node (the value in the needle) suddenly moves out of position. I do not understand this, because the CSS only involves colors and visibility, never any transformation.
https://github.com/JFXtras/jfxtras-labs/blob/8.0/src/main/resources/jfxtras/labs/internal/scene/control/gauge/linear/SimpleMetroArcGauge.css

Is there any way to debug what CSS settings are applied to nodes? I really would like to find out what causes that node to move.

Tom