diff --git a/packages/extension/public/index.html b/packages/extension/public/index.html
index fa77749f..02a01576 100644
--- a/packages/extension/public/index.html
+++ b/packages/extension/public/index.html
@@ -6,7 +6,7 @@
     <link href="fonts/fonts.css" rel="stylesheet">
   </head>
   <body style="height: 600px; margin:0; overflow-x:hidden; text-align:center">
-    <div id="root" style="box-sizing:border-box; margin:0 auto; padding:0; text-align:left; width:560px; height: calc(100% - 2px); max-width: 100%;"></div>
+    <div id="root" style="box-sizing:border-box; margin:0 auto; padding:0; text-align:left; width:560px; height: calc(100vh - 2px); max-width: 100%;"></div>
     <script src='./extension.js'></script>
   </body>
 </html>
diff --git a/packages/extension/public/notification.html b/packages/extension/public/notification.html
index 0291eba0..cf5aa6ca 100644
--- a/packages/extension/public/notification.html
+++ b/packages/extension/public/notification.html
@@ -5,8 +5,8 @@
     <title>polkadot{.js}</title>
     <link href="fonts/fonts.css" rel="stylesheet">
   </head>
-  <body style="height: 621px; margin:0; overflow-x:hidden; text-align:center">
-    <div id="root" style="box-sizing:border-box; margin:0 auto; padding:0; text-align:left; width:560px; height: calc(100% - 2px); max-width: 100%;"></div>
+  <body style="margin:0; overflow-x:hidden; text-align:center">
+    <div id="root" style="box-sizing:border-box; margin:0 auto; padding:0; text-align:left; width:560px; height: calc(100vh - 2px); max-width: 100%;"></div>
     <script src='./extension.js'></script>
   </body>
 </html>