diff --git a/src/BootstrapBlazor/BootstrapBlazor.csproj b/src/BootstrapBlazor/BootstrapBlazor.csproj
index 46f70311041..4bed1410bd6 100644
--- a/src/BootstrapBlazor/BootstrapBlazor.csproj
+++ b/src/BootstrapBlazor/BootstrapBlazor.csproj
@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.0.0-beta03</Version>
+    <Version>9.0.1-beta02</Version>
   </PropertyGroup>
 
   <ItemGroup>
diff --git a/src/BootstrapBlazor/Components/Modal/ModalDialog.razor.js b/src/BootstrapBlazor/Components/Modal/ModalDialog.razor.js
index 6a779c85e6b..e1603d2c9d5 100644
--- a/src/BootstrapBlazor/Components/Modal/ModalDialog.razor.js
+++ b/src/BootstrapBlazor/Components/Modal/ModalDialog.razor.js
@@ -121,15 +121,27 @@ export function init(id) {
     }
 
     if (el.classList.contains('is-draggable-center')) {
-        const width = el.offsetWidth / 2;
-        const height = el.offsetHeight / 2;
-
-        el.style.setProperty("margin-left", `calc(50vw - ${width}px)`);
-        el.style.setProperty("margin-top", `calc(50vh - ${height}px)`);
-        el.classList.remove('is-draggable-center');
+        const check = () => {
+            if (el.offsetWidth > 0) {
+                update(el);
+            }
+            else {
+                requestAnimationFrame(check);
+            }
+        }
+        requestAnimationFrame(check);
     }
 }
 
+const update = el => {
+    const width = el.offsetWidth / 2;
+    const height = el.offsetHeight / 2;
+
+    el.style.setProperty("margin-left", `calc(50vw - ${width}px)`);
+    el.style.setProperty("margin-top", `calc(50vh - ${height}px)`);
+    el.classList.remove('is-draggable-center');
+}
+
 export function dispose(id) {
     const dialog = Data.get(id)
     Data.remove(id)