diff --git a/examples/sites/src/views/components/components.vue b/examples/sites/src/views/components/components.vue
index ffe6be37e..1dc57a662 100644
--- a/examples/sites/src/views/components/components.vue
+++ b/examples/sites/src/views/components/components.vue
@@ -816,7 +816,6 @@ export default defineComponent({
     flex: 1;
     display: flex;
     justify-content: center;
-    min-width: 680px;
     padding: 0 40px;
   }
 
@@ -837,7 +836,6 @@ export default defineComponent({
 
     :deep(> .tiny-tabs__header) {
       position: sticky;
-      top: 90px;
       z-index: var(--docs-tabs-header-zindex);
       background-color: #fff;
 
@@ -974,6 +972,10 @@ export default defineComponent({
   column-gap: 16px;
 }
 
+.docs-content-main {
+  overflow: auto;
+}
+
 .cmp-container {
   p {
     font-size: 16px;
diff --git a/examples/sites/src/views/layout/layout.vue b/examples/sites/src/views/layout/layout.vue
index 40c8c54d8..d914eb795 100644
--- a/examples/sites/src/views/layout/layout.vue
+++ b/examples/sites/src/views/layout/layout.vue
@@ -196,9 +196,12 @@ export default defineComponent({
 .content-layout {
   display: flex;
   --layout-tree-menu-input-height: 32px;
-  --layout-content-main-min-width: 600px;
+  --layout-content-main-min-width: 200px;
   --layout-content-main-max-width: 1000px;
 }
+@media screen and (max-width: 640px) {
+  --layout-content-main-min-width: 600px;
+}
 
 .tiny-tooltip.tiny-tooltip__popper.is-light.docs-tooltip {
   border: none;