diff --git a/src/components/Workspace.jsx b/src/components/Workspace.jsx
index 3a52837..f617942 100644
--- a/src/components/Workspace.jsx
+++ b/src/components/Workspace.jsx
@@ -338,7 +338,7 @@ export default function WorkSpace() {
   }, [load]);
 
   return (
-    <div className="h-[100vh] flex flex-col overflow-hidden theme">
+    <div className="h-full flex flex-col overflow-hidden theme">
       <ControlPanel
         diagramId={id}
         setDiagramId={setId}
diff --git a/src/index.css b/src/index.css
index 61eb566..dba02a3 100644
--- a/src/index.css
+++ b/src/index.css
@@ -2,6 +2,22 @@
 @tailwind components;
 @tailwind utilities;
 
+@layer base {
+  /*
+   * Workaround to allow proper bottom positioning for fixed
+   * elements in mobile browsers with collapsing url bars:
+   * https://stackoverflow.com/a/17555766/1137077
+   */
+  :root,
+  html,
+  body {
+    @apply h-full min-h-full;
+  }
+  #root {
+    @apply h-full min-h-full;
+  }
+}
+
 .semi-form-vertical .semi-form-field {
   margin: 0;
   padding-top: 8px !important;