是否有一种解决方法，可在CSS中使用Region的宽度和高度百分比值？

Question

如果我们可以在CSS中为Region的宽度和高度使用百分比值，那将非常方便，但是documentation指出：

  

百分比值没有用处，因为实际值将在布局父级之前根据区域父级的宽度和/或高度计算得出。

那么有没有解决方法？父级加载到场景后，我尝试使用Platform.runLater请求布局传递，但没有任何反应：

Main.java

public class Main extends Application {
  public static void main(String... args) {
    launch(args);
  }

  @Override
  public void start(Stage primaryStage) throws Exception {
    Scene scene = new Scene(FXMLLoader.load(getClass().getResource("main.fxml")));
    scene.getStylesheets().setAll(getClass().getResource("styles.css").toExternalForm());
    primaryStage.setScene(scene);
    primaryStage.show();
  }
}

main.fxml

<StackPane xmlns="http://javafx.com/javafx"
           xmlns:fx="http://javafx.com/fxml"
           fx:controller="Controller">
  <Region fx:id="child"
          styleClass="child"/>
</StackPane>

styles.css

.root {
  -fx-pref-width: 500px;
  -fx-pref-height: 500px;
}

.child {
  -fx-background-color: teal;
  -fx-pref-width: 50%;
  -fx-pref-height: 50%;
}

Controller.java

public class Controller implements Initializable {
  @FXML
  private Region child;

  @Override
  public void initialize(URL location, ResourceBundle resources) {
    Platform.runLater(() -> if (child != null) child.requestLayout());
  }
}