How can I create a responsive box design - javafx

Question

So I have 2 hboxes on top of each other to create the description and content of each box. They seem to look fine at the current size (look at img 1). However, it is not responsive. Once I use a bigger screen, the boxes don't adjust to the size and just stay in place (look at img 2). Sometimes they don't even stay on top of each other but move to the right or the left (look at img 3). Could you please help me suggest a better design to make my boxes responsive? Thank you in advance.
Image 1:
Image 2:
Image 3:
Here is my fxml code:
<?xml version="1.0" encoding="UTF-8"?>
<?import com.jfoenix.controls.JFXButton?>
<?import com.jfoenix.controls.JFXTabPane?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.Tab?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>
<AnchorPane id="AnchorPane" prefHeight="752.0" prefWidth="1280.0" styleClass="main-anchor-pane" stylesheets="#../../resources/css/Consolidated.css" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" fx:controller="gui.controllers.SalesDataController">
<children>
<JFXTabPane fx:id="tabPane" layoutX="181.0" layoutY="91.0" prefHeight="752.0" prefWidth="1280.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
<tabs>
<Tab fx:id="addNewTab" text="Add New">
<content>
<AnchorPane maxWidth="1.7976931348623157E308" prefWidth="1280.0">
<children>
<HBox layoutY="79.0" prefHeight="383.0" prefWidth="1228.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
<children>
<VBox prefHeight="331.0" prefWidth="331.0" styleClass="vbox-properties">
<children>
<GridPane prefHeight="153.0" prefWidth="331.0">
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
</rowConstraints>
<opaqueInsets>
<Insets />
</opaqueInsets>
<padding>
<Insets left="10.0" right="10.0" />
</padding>
</GridPane>
</children>
<HBox.margin>
<Insets left="15.0" />
</HBox.margin>
</VBox>
<VBox prefHeight="312.0" prefWidth="331.0" styleClass="vbox-properties">
<children>
<GridPane prefHeight="179.0" prefWidth="183.0">
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="12.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="12.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="12.0" prefHeight="30.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="12.0" prefHeight="30.0" vgrow="SOMETIMES" />
</rowConstraints>
<opaqueInsets>
<Insets />
</opaqueInsets>
<padding>
<Insets left="10.0" right="10.0" />
</padding>
</GridPane>
<GridPane prefHeight="101.0" prefWidth="351.0">
<columnConstraints>
<ColumnConstraints />
</columnConstraints>
<rowConstraints>
<RowConstraints />
</rowConstraints>
<opaqueInsets>
<Insets />
</opaqueInsets>
<VBox.margin>
<Insets top="30.0" />
</VBox.margin>
</GridPane>
</children>
<HBox.margin>
<Insets left="71.75" right="71.75" />
</HBox.margin>
</VBox>
<VBox prefHeight="166.0" prefWidth="331.0" styleClass="vbox-properties">
<children>
<GridPane prefHeight="101.0" prefWidth="331.0">
<columnConstraints>
<ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
</columnConstraints>
<rowConstraints>
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
<RowConstraints minHeight="10.0" prefHeight="40.0" vgrow="SOMETIMES" />
</rowConstraints>
<opaqueInsets>
<Insets />
</opaqueInsets>
<padding>
<Insets left="10.0" right="10.0" />
</padding>
</GridPane>
</children>
</VBox>
</children>
<padding>
<Insets left="71.75" right="71.75" />
</padding>
</HBox>
<HBox alignment="CENTER" layoutY="462.0" prefHeight="51.0" prefWidth="277.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="462.0">
<children>
<JFXButton fx:id="addButton" mnemonicParsing="false" onAction="#addAction" prefWidth="70.0" text="ADD">
<HBox.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</HBox.margin>
<padding>
<Insets bottom="6.0" left="6.0" right="6.0" top="6.0" />
</padding>
</JFXButton>
<JFXButton fx:id="updateButton" mnemonicParsing="false" onAction="#updateSalesDataAction" prefWidth="70.0" text="UPDATE">
<HBox.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</HBox.margin>
<padding>
<Insets bottom="6.0" left="6.0" right="6.0" top="6.0" />
</padding>
</JFXButton>
<JFXButton fx:id="clearButton" mnemonicParsing="false" onAction="#clearAction" prefWidth="70.0" text="CLEAR">
<padding>
<Insets bottom="6.0" left="6.0" right="6.0" top="6.0" />
</padding>
<HBox.margin>
<Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
</HBox.margin>
</JFXButton>
</children>
</HBox>
<HBox alignment="CENTER" layoutX="502.0" layoutY="521.0" prefHeight="33.0" prefWidth="277.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="521.0" />
<HBox layoutY="29.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0">
<children>
<Label alignment="CENTER" prefHeight="55.0" prefWidth="279.0" styleClass="label-color" text="Info A" textAlignment="CENTER">
<font>
<Font name="System Bold" size="18.0" />
</font>
<HBox.margin>
<Insets left="41.0" />
</HBox.margin>
</Label>
<Label alignment="CENTER" prefHeight="55.0" prefWidth="279.0" styleClass="label-color" text="Info B" textAlignment="CENTER">
<font>
<Font name="System Bold" size="18.0" />
</font>
<HBox.margin>
<Insets left="123.75" right="97.75" />
</HBox.margin>
</Label>
<Label alignment="CENTER" prefHeight="55.0" prefWidth="279.0" styleClass="label-color" text="Info C" textAlignment="CENTER">
<font>
<Font name="System Bold" size="18.0" />
</font>
<HBox.margin>
<Insets left="26.0" />
</HBox.margin>
</Label>
</children>
<padding>
<Insets left="71.75" right="71.75" />
</padding>
</HBox>
</children>
</AnchorPane>
</content>
</Tab>
</tabs>
</JFXTabPane>
</children>
</AnchorPane>