diff --git a/projects/ngx-datatable/src/lib/components/datatable.component.ts b/projects/ngx-datatable/src/lib/components/datatable.component.ts
index b26f07c89..361bcf498 100644
--- a/projects/ngx-datatable/src/lib/components/datatable.component.ts
+++ b/projects/ngx-datatable/src/lib/components/datatable.component.ts
@@ -21,6 +21,7 @@ import {
   OnInit,
   Output,
   QueryList,
+  signal,
   TemplateRef,
   ViewChild,
   ViewEncapsulation
@@ -704,6 +705,11 @@ export class DatatableComponent<TRow = any>
   _ghostLoadingIndicator = false;
   _defaultColumnWidth?: number;
   protected verticalScrollVisible = false;
+  // In case horizontal scroll is enabled
+  // the column widths are initially calculated without vertical scroll offset
+  // this makes horizontal scroll to appear on load even if columns can fit in view
+  // this will be set to true once rows are available and rendered on UI
+  private _rowInitDone = signal(false);
 
   constructor() {
     // apply global settings from Module.forRoot
@@ -857,6 +863,7 @@ export class DatatableComponent<TRow = any>
       }
       if (rowDiffers) {
         queueMicrotask(() => {
+          this._rowInitDone.set(true);
           this.recalculate();
           this.cd.markForCheck();
         });
@@ -908,34 +915,34 @@ export class DatatableComponent<TRow = any>
     }
     const bodyElement = this.bodyElement?.nativeElement;
     this.verticalScrollVisible = bodyElement?.scrollHeight > bodyElement?.clientHeight;
-    if (this.scrollbarV && !this.scrollbarVDynamic) {
-      width = width - (this.verticalScrollVisible ? this.scrollbarHelper.width : 0);
-    } else if (this.scrollbarVDynamic) {
-      const scrollerHeight = this.bodyComponent?.scroller?.element.offsetHeight;
-      if (scrollerHeight && this.bodyHeight < scrollerHeight) {
-        width = width - (this.verticalScrollVisible ? this.scrollbarHelper.width : 0);
-      }
-
-      if (this.headerComponent && this.headerComponent.innerWidth !== width) {
-        this.headerComponent.innerWidth = width;
-      }
-      if (this.bodyComponent && this.bodyComponent.innerWidth !== width) {
-        this.bodyComponent.innerWidth = width;
-        this.bodyComponent.cd.markForCheck();
-      }
+    if (this.scrollbarV || this.scrollbarVDynamic) {
+      width =
+        width -
+        (this.verticalScrollVisible || !this._rowInitDone() ? this.scrollbarHelper.width : 0);
     }
 
     if (this.columnMode === ColumnMode.force) {
-      forceFillColumnWidths(columns, width, forceIdx, allowBleed, this._defaultColumnWidth);
+      forceFillColumnWidths(
+        columns,
+        width,
+        forceIdx,
+        allowBleed,
+        this._defaultColumnWidth,
+        this.scrollbarHelper.width
+      );
     } else if (this.columnMode === ColumnMode.flex) {
       adjustColumnWidths(columns, width);
     }
 
-    if (this.bodyComponent) {
-      this.bodyComponent.updateColumnGroupWidths();
+    if (this.bodyComponent && this.bodyComponent.columnGroupWidths.total !== width) {
+      this.bodyComponent.columns = [...this._internalColumns];
       this.bodyComponent.cd.markForCheck();
     }
 
+    if (this.headerComponent && this.headerComponent._columnGroupWidths.total !== width) {
+      this.headerComponent.columns = [...this._internalColumns];
+    }
+
     return columns;
   }
 
diff --git a/projects/ngx-datatable/src/lib/utils/math.ts b/projects/ngx-datatable/src/lib/utils/math.ts
index 684429253..8ed2210da 100644
--- a/projects/ngx-datatable/src/lib/utils/math.ts
+++ b/projects/ngx-datatable/src/lib/utils/math.ts
@@ -126,7 +126,8 @@ export function forceFillColumnWidths(
   expectedWidth: number,
   startIdx: number,
   allowBleed: boolean,
-  defaultColWidth: number = 150
+  defaultColWidth: number = 150,
+  verticalScrollWidth = 0
 ) {
   const columnsToResize = allColumns
     .slice(startIdx + 1, allColumns.length)
@@ -142,6 +143,7 @@ export function forceFillColumnWidths(
   let exceedsWindow = false;
   let contentWidth = getContentWidth(allColumns, defaultColWidth);
   let remainingWidth = expectedWidth - contentWidth;
+  const initialRemainingWidth = remainingWidth;
   const columnsProcessed: any[] = [];
   const remainingWidthLimit = 1; // when to stop
 
@@ -151,7 +153,8 @@ export function forceFillColumnWidths(
     exceedsWindow = contentWidth >= expectedWidth;
 
     for (const column of columnsToResize) {
-      if (exceedsWindow && allowBleed) {
+      // don't bleed if the initialRemainingWidth is same as verticalScrollWidth
+      if (exceedsWindow && allowBleed && initialRemainingWidth !== -1 * verticalScrollWidth) {
         column.width = column.$$oldWidth || column.width || defaultColWidth;
       } else {
         const newSize = (column.width || defaultColWidth) + additionWidthPerColumn;