diff --git a/index.html b/index.html
index 90aeb6c..a9a3997 100644
--- a/index.html
+++ b/index.html
@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta
       name="viewport"
-      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
     />
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <title>SecScore</title>
diff --git a/src/App.tsx b/src/App.tsx
index 9e06850..98cc0df 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -296,7 +296,7 @@ function MainContent(): React.JSX.Element {
       }}
     >
       {contextHolder}
-      <Layout style={{ height: "100vh", flexDirection: "row", overflow: "hidden" }}>
+      <Layout style={{ height: "100%", minHeight: "100dvh", flexDirection: "row", overflow: "hidden" }}>
         <Sidebar
           activeMenu={activeMenu}
           permission={permission}
diff --git a/src/assets/main.css b/src/assets/main.css
index 34dbac8..586cc80 100644
--- a/src/assets/main.css
+++ b/src/assets/main.css
@@ -13,6 +13,7 @@ html,
 body,
 #root {
   height: 100%;
+  min-height: 100dvh;
   margin: 0;
   padding: 0;
   overflow: hidden;