diff --git a/packages/builder/src/components/userInterface/temporaryPanelStructure.js b/packages/builder/src/components/userInterface/temporaryPanelStructure.js
index e7033f1c8e..aaac780afd 100644
--- a/packages/builder/src/components/userInterface/temporaryPanelStructure.js
+++ b/packages/builder/src/components/userInterface/temporaryPanelStructure.js
@@ -346,6 +346,12 @@ export default {
                 ],
                 placeholder: "alpine",
               },
+              {
+                label: "Height",
+                key: "height",
+                defaultValue: "500",
+                control: Input
+              },
             ],
           },
           children: [],
diff --git a/packages/standard-components/components.json b/packages/standard-components/components.json
index 76675ac63b..4650d63e00 100644
--- a/packages/standard-components/components.json
+++ b/packages/standard-components/components.json
@@ -237,7 +237,8 @@
 					"balham-dark",
 					"material"
 				]
-			}
+			},
+			"height": "number"
 		}
 	},
 	"dataform": {
diff --git a/packages/standard-components/src/DataGrid/Component.svelte b/packages/standard-components/src/DataGrid/Component.svelte
index 01ed620a5c..727037b434 100644
--- a/packages/standard-components/src/DataGrid/Component.svelte
+++ b/packages/standard-components/src/DataGrid/Component.svelte
@@ -18,6 +18,7 @@
   export let datasource = {}
   export let editable
   export let theme = 'alpine'
+  export let height;
 
   let dataLoaded = false
   let data
@@ -110,7 +111,7 @@
     href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css" />
 </svelte:head>
 
-<div class="container">
+<div class="container" style="--grid-height: {height}px">
   {#if dataLoaded}
     {#if editable}
       <div class="controls">