[CSS] Button size does not change relative to fonts

A DESCRIPTION OF THE PROBLEM :
By using of a base.css with .root -> -fx-font-size = n and different padding/spacing/insets/radius/min/max/pref/etc-sizes + -fx-font-size in “em” allows to have root-font-size depending controls in a JavaFX application. For example for a button:

.root {
    -fx-font-size: 14px;
}

.button {
    -fx-font-family: "Arial";
    -fx-font-weight: bold;
    -fx-font-size: 2em;

    -fx-min-width: 10em;
    -fx-max-width: 10em;
    -fx-pref-width: 10em;

    -fx-min-height: 10em;
    -fx-max-height: 10em;
    -fx-pref-height: 10em;
}


If to change

.root {
    -fx-font-size: 12px;
}

The javafx-scene will adapt proportional.

And it allows to simulate a zooming/scaling of the javafx-scene via adding of several zoom_x.css to the JavaFX Scene/Parent Stylesheets like:

zoom_65.css:
.root {
    -fx-font-size: 9;
}

zoom_85.css:
.root {
    -fx-font-size: 12;
}

zoom_150.css:
.root {
    -fx-font-size: 21;
}

zoom_200.css:
.root {
    -fx-font-size: 28;
}

But the behavior in this case with a button is different as expected – the font-size of the button-text is adapted proportional, but the min/max/pref-sizes remain the same and still be unchanged.
The reason in the:

.button -fx-font-size: 2em;

Because the javafx.scene.CssStyleHelper has in the code-line 1388:

boolean isFontProperty = "-fx-font".equals(property) || "-fx-font-size".equals(property);

then 1392:

boolean isRelative = ParsedValueImpl.containsFontRelativeSize(resolved, isFontProperty);

and 1444:

// did we get a fontValue from the preceding block?
// if not, get it from our cacheEntry or choose the default
if (fontForFontRelativeSizes == null) {
    if (fontFromCacheEntry != null && fontFromCacheEntry.isRelative() == false) {
        fontForFontRelativeSizes = (Font)fontFromCacheEntry.getValue();
    } else {
        fontForFontRelativeSizes = Font.getDefault();
    }
}

It means, for the -fx-font-size: 2em; it is isFontProperty and isRelative, therefore will be recalculated according the actual .root -fx-font-size from a zoom_xyz.css.
But for the -fx-min-width: 10em; it is NOT isFontProperty, but isRelative, and for recalculating will be used fontForFontRelativeSizes = Font.getDefault();
It is the constant and as default it is 12px for Windows OS and 13px for MacOs.
Therefore, the button size remains the same.

These all padding/spacing/insets/radius/min/max/pref/etc-sizes must be based on a current .root -> -fx-font-size and recalculated.


CUSTOMER SUBMITTED WORKAROUND :
To define a .control the -fx-font-size: XXXem; deeply, for example for .text like:

.button {
    -fx-font-family: "Arial";
    -fx-font-weight: bold;

    -fx-min-width: 10em;
    -fx-max-width: 10em;
    -fx-pref-width: 10em;

    -fx-min-height: 10em;
    -fx-max-height: 10em;
    -fx-pref-height: 10em;
}

.button .text {
    -fx-font-size: 2em;
}

Then the -fx-font-size: 2em; belongs only to the .text-class and doesn’t influence on the higher .button-class.

FREQUENCY : always