diff --git a/src/client/theme-default/components/VPContent.vue b/src/client/theme-default/components/VPContent.vue
index 31c3d1cb377c..196f2ca185a8 100644
--- a/src/client/theme-default/components/VPContent.vue
+++ b/src/client/theme-default/components/VPContent.vue
@@ -16,7 +16,6 @@ const { hasSidebar } = useSidebar()
     id="VPContent"
     :class="{
       'has-sidebar': hasSidebar,
-      'is-home': frontmatter.layout === 'home'
     }"
   >
     <slot name="not-found" v-if="page.isNotFound"><NotFound /></slot>
@@ -61,15 +60,16 @@ const { hasSidebar } = useSidebar()
   width: 100%;
 }
 
-.VPContent.is-home {
-  width: 100%;
-  max-width: 100%;
-}
-
 .VPContent.has-sidebar {
   margin: 0;
 }
 
+@media (min-width: 768px) {
+  .VPContent {
+    width: 100vw;
+  }
+}
+
 @media (min-width: 960px) {
   .VPContent {
     padding-top: var(--vp-nav-height);
diff --git a/src/client/theme-default/components/VPFooter.vue b/src/client/theme-default/components/VPFooter.vue
index 50c381d9e9eb..697bb81eac28 100644
--- a/src/client/theme-default/components/VPFooter.vue
+++ b/src/client/theme-default/components/VPFooter.vue
@@ -30,6 +30,7 @@ const { hasSidebar } = useSidebar()
 
 @media (min-width: 768px) {
   .VPFooter {
+    width: 100vw;
     padding: 32px;
   }
 }
diff --git a/src/client/theme-default/components/VPLocalNav.vue b/src/client/theme-default/components/VPLocalNav.vue
index 39b26742bda4..5f5d3920cd2e 100644
--- a/src/client/theme-default/components/VPLocalNav.vue
+++ b/src/client/theme-default/components/VPLocalNav.vue
@@ -109,6 +109,10 @@ const classes = computed(() => {
 }
 
 @media (min-width: 768px) {
+  .VPLocalNav {
+    width: 100vw;
+  }
+
   .menu {
     padding: 0 32px;
   }
diff --git a/src/client/theme-default/components/VPNav.vue b/src/client/theme-default/components/VPNav.vue
index b654a043fd09..19c2e93f8488 100644
--- a/src/client/theme-default/components/VPNav.vue
+++ b/src/client/theme-default/components/VPNav.vue
@@ -36,6 +36,12 @@ provide('close-screen', closeScreen)
   transition: background-color 0.5s;
 }
 
+@media (min-width: 768px) {
+  .VPNav {
+    width: 100vw;
+  }
+}
+
 @media (min-width: 960px) {
   .VPNav {
     position: fixed;
diff --git a/src/client/theme-default/components/VPSidebar.vue b/src/client/theme-default/components/VPSidebar.vue
index 16f0aadd860a..d634893f4c7a 100644
--- a/src/client/theme-default/components/VPSidebar.vue
+++ b/src/client/theme-default/components/VPSidebar.vue
@@ -106,8 +106,8 @@ watchPostEffect(async () => {
 
 @media (min-width: 1440px) {
   .VPSidebar {
-    padding-left: max(32px, calc((100% - (var(--vp-layout-max-width) - 64px)) / 2));
-    width: calc((100% - (var(--vp-layout-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px);
+    padding-left: max(32px, calc((100vw - (var(--vp-layout-max-width) - 64px)) / 2));
+    width: calc((100vw - (var(--vp-layout-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px);
   }
 }
 
diff --git a/src/client/theme-default/styles/base.css b/src/client/theme-default/styles/base.css
index 5e45af7c7d82..350523e8dab4 100644
--- a/src/client/theme-default/styles/base.css
+++ b/src/client/theme-default/styles/base.css
@@ -30,6 +30,7 @@ body {
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
+  overflow-x: hidden;
 }
 
 main {