Relative CSS-Attributes don't work all time

Running the attached snippet and execute the following steps:
* Click "Print info"
* Click "Flip size"
* Click "Print info"

Results in the following output
Default Font: 13.0
    0.2857142857142857em == 3.714285714285714
    0.3333333333333333em == 4.333333333333333
============
Default:
    Padding: Insets [top=4.0, right=4.0, bottom=4.0, left=4.0]
    Corner: CornerRadii [uniform radius = 3.7]
Rel:
    Padding: Insets [top=4.3, right=4.3, bottom=4.3, left=4.3]
    Corner: CornerRadii [uniform radius = 3.7]
============
Default:
    Padding: Insets [top=8.0, right=8.0, bottom=8.0, left=8.0]
    Corner: CornerRadii [uniform radius = 3.7]
Rel:
    Padding: Insets [top=4.3, right=4.3, bottom=4.3, left=4.3]
    Corner: CornerRadii [uniform radius = 3.7]

Expectation:
* CornerRadii is always 4 & 8
* Padding is always 4 & 8

Observation 1: The CornerRadii is relative to the default font
Observation 2: The CornerRadii does not change
Observation 3: The padding if the font is relative uses the default font for the size calculation
Observation 4: The padding does not change if the font is relative