Why does adding another element to a BorderPane mess up my formatting?

When creating a GridPane in the Center of a BorderPane it is quadratic and everything is fine:

even when having an uneqal amount of columns and rows everything works perfectly:

but as soon as I add a VBox or any other element to the left slot of the BorderPane it looks like this:

I need the GridPane to stay quadratic, at least after being created. When resized it is not important for the cells to stay quadratic but they should be initally.

I also tried wrapping the GridPane in a VBox and that VBox in a HBox and binding their Height and Width Properties, but that only makes the cells maintain the same size.

Basically I want it to initally look like this:

I think if it was possible to tell the GridPane to not fill the empty spaces upwards, downwards and sitewise then it would be easy.

fxml File:

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.*?>

<BorderPane maxHeight="-Infinity" maxWidth="-Infinity" xmlns="http://javafx.com/javafx/16" xmlns:fx="http://javafx.com/fxml/1" fx:controller="gui.UserInterfaceController">
   <center>
      <GridPane fx:id="grdPn" gridLinesVisible="true" onMouseClicked="#onGrdPnMouseClicked">
        <columnConstraints>
          <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />
          <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="30.0" />

      
      
        </columnConstraints>
        <rowConstraints>
          <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
          <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
        </rowConstraints>
      </GridPane>
   </center>
   <left>
      <VBox prefHeight="306.0" prefWidth="100.0" BorderPane.alignment="CENTER" />
   </left>
</BorderPane>

Creating the stage and scene:

        FXMLLoader fxmlLoader = new FXMLLoader(ApplicationMain.class.getResource("sample.fxml"));
        Scene scene = new Scene(fxmlLoader.load());
        stage.setTitle("Example");
        stage.setScene(scene);
        stage.show();

If you remove the VBox the GridPane becomes square again.