diff --git a/docs/.vitepress/vitepress/components/navbar/vp-social-link.vue b/docs/.vitepress/vitepress/components/navbar/vp-social-link.vue
index 9ac7d51dd8..916dfd680e 100644
--- a/docs/.vitepress/vitepress/components/navbar/vp-social-link.vue
+++ b/docs/.vitepress/vitepress/components/navbar/vp-social-link.vue
@@ -24,7 +24,6 @@ defineProps<{
 
 <style scoped lang="scss">
 .social-link {
-  padding: 0 4px;
   color: var(--text-color);
 }
 </style>
diff --git a/docs/.vitepress/vitepress/styles/content.scss b/docs/.vitepress/vitepress/styles/content.scss
index a3e61eaf4a..7ded3e772c 100644
--- a/docs/.vitepress/vitepress/styles/content.scss
+++ b/docs/.vitepress/vitepress/styles/content.scss
@@ -1,4 +1,5 @@
 @use './mixins' as *;
+@use './vars' as *;
 @use './content/doc-content';
 @use './content/hero-content';
 
@@ -7,14 +8,20 @@
     padding-top: var(--nav-height);
 
     &.has-sidebar {
-      padding-left: var(--sidebar-width-sm);
+      padding-left: calc(var(--sidebar-width-sm) + 10px);
       @include respond-to('xlg') {
-        padding-left: var(--vp-sidebar-width-small);
+        padding-left: calc(var(--vp-sidebar-width-small) - $scrollbar-size);
       }
       @include respond-to('xxl') {
         padding-left: calc(
           (100vw - var(--vp-screen-max-width)) / 2 +
-            var(--vp-sidebar-width-small)
+            var(--vp-sidebar-width-small) - 42px
+        );
+      }
+      @include respond-to('max') {
+        padding-left: calc(
+          (100vw - var(--vp-screen-max-width)) / 2 +
+            var(--vp-sidebar-width-small) - 4px
         );
       }
     }