diff --git a/projects/angular/clarity.api.md b/projects/angular/clarity.api.md
index 6cc3a62665..cbd4fc82c1 100644
--- a/projects/angular/clarity.api.md
+++ b/projects/angular/clarity.api.md
@@ -5257,7 +5257,7 @@ export class ÇlrDatagridHeaderRenderer implements OnDestroy {
 
 // @public (undocumented)
 export class ÇlrDatagridMainRenderer implements AfterContentInit, AfterViewInit, AfterViewChecked, OnDestroy {
-    constructor(organizer: DatagridRenderOrganizer, items: Items, page: Page, el: ElementRef<HTMLElement>, renderer: Renderer2, detailService: DetailService, tableSizeService: TableSizeService, columnsService: ColumnsService, ngZone: NgZone, keyNavigation: KeyNavigationGridController);
+    constructor(datagrid: ClrDatagrid, organizer: DatagridRenderOrganizer, items: Items, page: Page, el: ElementRef<HTMLElement>, renderer: Renderer2, detailService: DetailService, tableSizeService: TableSizeService, columnsService: ColumnsService, ngZone: NgZone, keyNavigation: KeyNavigationGridController);
     // (undocumented)
     ngAfterContentInit(): void;
     // (undocumented)
diff --git a/projects/angular/src/data/datagrid/render/main-renderer.ts b/projects/angular/src/data/datagrid/render/main-renderer.ts
index 55778c9611..99f9f0eb3b 100644
--- a/projects/angular/src/data/datagrid/render/main-renderer.ts
+++ b/projects/angular/src/data/datagrid/render/main-renderer.ts
@@ -22,6 +22,7 @@ import {
 import { Subscription } from 'rxjs';
 
 import { DomAdapter } from '../../../utils/dom-adapter/dom-adapter';
+import { ClrDatagrid } from '../datagrid';
 import { DatagridColumnChanges } from '../enums/column-changes.enum';
 import { DatagridRenderStep } from '../enums/render-step.enum';
 import { ColumnStateDiff } from '../interfaces/column-state.interface';
@@ -68,6 +69,7 @@ export class DatagridMainRenderer implements AfterContentInit, AfterViewInit, Af
   private columnsSizesStable = false;
 
   constructor(
+    private datagrid: ClrDatagrid,
     private organizer: DatagridRenderOrganizer,
     private items: Items,
     private page: Page,
@@ -118,10 +120,9 @@ export class DatagridMainRenderer implements AfterContentInit, AfterViewInit, Af
   }
 
   ngAfterViewChecked() {
-    if (this.shouldStabilizeColumns) {
-      setTimeout(() => {
-        this.stabilizeColumns();
-      }, 0);
+    const datagridIsVisible = this.checkAndUpdateVisibility();
+    if (this.shouldStabilizeColumns && datagridIsVisible) {
+      this.stabilizeColumns();
     }
 
     if (this.shouldComputeHeight()) {
@@ -284,4 +285,14 @@ export class DatagridMainRenderer implements AfterContentInit, AfterViewInit, Af
       this.columnsSizesStable = true;
     }
   }
+
+  private checkAndUpdateVisibility() {
+    if (this.el.nativeElement.offsetParent) {
+      this.datagrid.datagrid.nativeElement.style.visibility = 'visible';
+      return true;
+    } else {
+      this.datagrid.datagrid.nativeElement.style.visibility = 'hidden';
+      return false;
+    }
+  }
 }
diff --git a/tests/snapshots/chromium/datagrid/expandable-rows--expandable-rows-core-dark.png b/tests/snapshots/chromium/datagrid/expandable-rows--expandable-rows-core-dark.png
index ac90e1fd5b..f64831e833 100644
Binary files a/tests/snapshots/chromium/datagrid/expandable-rows--expandable-rows-core-dark.png and b/tests/snapshots/chromium/datagrid/expandable-rows--expandable-rows-core-dark.png differ
diff --git a/tests/snapshots/chromium/datagrid/expandable-rows--expandable-rows-core-light.png b/tests/snapshots/chromium/datagrid/expandable-rows--expandable-rows-core-light.png
index 10026ee947..18048e7a0d 100644
Binary files a/tests/snapshots/chromium/datagrid/expandable-rows--expandable-rows-core-light.png and b/tests/snapshots/chromium/datagrid/expandable-rows--expandable-rows-core-light.png differ