diff --git a/src/managers/ScrollManager.ts b/src/managers/ScrollManager.ts
index 229e079..6ac4124 100644
--- a/src/managers/ScrollManager.ts
+++ b/src/managers/ScrollManager.ts
@@ -331,22 +331,31 @@ export class ScrollManager {
     // Calculate available height for scrollable content
     const availableHeight = containerRect.height - headerHeight;
     
+    // Calculate available width (container width minus time-axis and scrollbar)
+    const availableWidth = containerRect.width - 60 - 20; // 60px time-axis, 20px scrollbar
+    
     console.log('ScrollManager: Dynamic height calculation');
     console.log('- Container height:', containerRect.height);
     console.log('- Navigation height:', navHeight);
     console.log('- Header height:', headerHeight);
     console.log('- Available height:', availableHeight);
+    console.log('- Available width:', availableWidth);
     
-    // Set the height on scrollable content
+    // Set the height and width on scrollable content
     if (availableHeight > 0) {
       this.scrollableContent.style.height = `${availableHeight}px`;
-      
-      // Recalculate scroll bounds after height change
-      setTimeout(() => {
-        this.calculateScrollBounds();
-        this.updateHandlePosition();
-      }, 0);
     }
+    if (availableWidth > 0) {
+      this.scrollableContent.style.width = `${availableWidth}px`;
+    }
+    
+    // Recalculate scroll bounds after dimension changes
+    setTimeout(() => {
+      this.calculateScrollBounds();
+      this.calculateHorizontalScrollBounds();
+      this.updateHandlePosition();
+      this.updateHorizontalHandlePosition();
+    }, 0);
   }
 
   /**
diff --git a/wwwroot/css/calendar-layout-css.css b/wwwroot/css/calendar-layout-css.css
index c9e362a..f3ef596 100644
--- a/wwwroot/css/calendar-layout-css.css
+++ b/wwwroot/css/calendar-layout-css.css
@@ -262,8 +262,7 @@ swp-scrollable-content {
   scroll-behavior: smooth;
   position: relative;
   display: grid;
-  /* Height will be set dynamically by ScrollManager via ResizeObserver */
-  width: calc(100vw - 60px - 20px); /* Viewport width minus time-axis and scrollbar */
+  /* Height and width will be set dynamically by ScrollManager via ResizeObserver */
   
   /* Hide native scrollbars */
   scrollbar-width: none; /* Firefox */