diff --git a/packages/twenty-front/src/loading/components/LeftPanelSkeletonLoader.tsx b/packages/twenty-front/src/loading/components/LeftPanelSkeletonLoader.tsx
index e1f73257f..a6caf8861 100644
--- a/packages/twenty-front/src/loading/components/LeftPanelSkeletonLoader.tsx
+++ b/packages/twenty-front/src/loading/components/LeftPanelSkeletonLoader.tsx
@@ -1,6 +1,6 @@
-import Skeleton, { SkeletonTheme } from 'react-loading-skeleton';
 import styled from '@emotion/styled';
 import { motion } from 'framer-motion';
+import Skeleton, { SkeletonTheme } from 'react-loading-skeleton';
 import { ANIMATION, BACKGROUND_LIGHT, GRAY_SCALE } from 'twenty-ui';
 
 import { DESKTOP_NAV_DRAWER_WIDTHS } from '@/ui/navigation/navigation-drawer/constants/DesktopNavDrawerWidths';
@@ -18,7 +18,7 @@ const StyledItemsContainer = styled.div`
   gap: 32px;
   margin-bottom: auto;
   overflow-y: auto;
-  height: calc(100vh - 32px);
+  height: calc(100dvh - 32px);
   min-width: 216px;
   max-width: 216px;
 `;
diff --git a/packages/twenty-front/src/loading/components/UserOrMetadataLoader.tsx b/packages/twenty-front/src/loading/components/UserOrMetadataLoader.tsx
index d4d078619..da129175e 100644
--- a/packages/twenty-front/src/loading/components/UserOrMetadataLoader.tsx
+++ b/packages/twenty-front/src/loading/components/UserOrMetadataLoader.tsx
@@ -11,7 +11,7 @@ const StyledContainer = styled.div`
   display: flex;
   flex-direction: row;
   gap: 12px;
-  height: 100vh;
+  height: 100dvh;
   min-width: ${DESKTOP_NAV_DRAWER_WIDTHS.menu}px;
   width: 100%;
   padding: 12px 8px 12px;
diff --git a/packages/twenty-front/src/modules/ui/feedback/dialog-manager/components/Dialog.tsx b/packages/twenty-front/src/modules/ui/feedback/dialog-manager/components/Dialog.tsx
index 905bbe033..90e0a4d22 100644
--- a/packages/twenty-front/src/modules/ui/feedback/dialog-manager/components/Dialog.tsx
+++ b/packages/twenty-front/src/modules/ui/feedback/dialog-manager/components/Dialog.tsx
@@ -1,6 +1,6 @@
-import { useCallback } from 'react';
 import styled from '@emotion/styled';
 import { motion } from 'framer-motion';
+import { useCallback } from 'react';
 import { Key } from 'ts-key-enum';
 
 import { Button } from '@/ui/input/button/components/Button';
@@ -13,7 +13,7 @@ const StyledDialogOverlay = styled(motion.div)`
   align-items: center;
   background: ${({ theme }) => theme.background.overlay};
   display: flex;
-  height: 100vh;
+  height: 100dvh;
   justify-content: center;
   left: 0;
   position: fixed;
diff --git a/packages/twenty-front/src/modules/ui/layout/page/BlankLayout.tsx b/packages/twenty-front/src/modules/ui/layout/page/BlankLayout.tsx
index 7836cd39d..ab2e3eba7 100644
--- a/packages/twenty-front/src/modules/ui/layout/page/BlankLayout.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/page/BlankLayout.tsx
@@ -1,12 +1,12 @@
-import { Outlet } from 'react-router-dom';
 import { css, Global, useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
+import { Outlet } from 'react-router-dom';
 
 const StyledLayout = styled.div`
   background: ${({ theme }) => theme.background.noisy};
   display: flex;
   flex-direction: column;
-  height: 100vh;
+  height: 100dvh;
   position: relative;
   scrollbar-width: 4px;
   width: 100%;
diff --git a/packages/twenty-front/src/modules/ui/layout/page/DefaultLayout.tsx b/packages/twenty-front/src/modules/ui/layout/page/DefaultLayout.tsx
index d347a23d9..a41e79142 100644
--- a/packages/twenty-front/src/modules/ui/layout/page/DefaultLayout.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/page/DefaultLayout.tsx
@@ -1,7 +1,7 @@
-import { Outlet } from 'react-router-dom';
 import { css, Global, useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import { AnimatePresence, LayoutGroup, motion } from 'framer-motion';
+import { Outlet } from 'react-router-dom';
 
 import { AuthModal } from '@/auth/components/Modal';
 import { CommandMenu } from '@/command-menu/components/CommandMenu';
@@ -21,7 +21,7 @@ const StyledLayout = styled.div`
   background: ${({ theme }) => theme.background.noisy};
   display: flex;
   flex-direction: column;
-  height: 100vh;
+  height: 100dvh;
   position: relative;
   scrollbar-color: ${({ theme }) => theme.border.color.medium};
   scrollbar-width: 4px;
diff --git a/packages/twenty-front/src/pages/auth/Authorize.tsx b/packages/twenty-front/src/pages/auth/Authorize.tsx
index 611e265d4..20be8c501 100644
--- a/packages/twenty-front/src/pages/auth/Authorize.tsx
+++ b/packages/twenty-front/src/pages/auth/Authorize.tsx
@@ -1,6 +1,6 @@
+import styled from '@emotion/styled';
 import { useEffect, useState } from 'react';
 import { useNavigate, useSearchParams } from 'react-router-dom';
-import styled from '@emotion/styled';
 
 import { AppPath } from '@/types/AppPath';
 import { MainButton } from '@/ui/input/button/components/MainButton';
@@ -14,7 +14,7 @@ const StyledContainer = styled.div`
   display: flex;
   align-items: center;
   flex-direction: column;
-  height: 100vh;
+  height: 100dvh;
   justify-content: center;
   width: 100%;
 `;