diff --git a/packages/x-data-grid/src/components/GridSkeletonLoadingOverlay.tsx b/packages/x-data-grid/src/components/GridSkeletonLoadingOverlay.tsx
index 62643bb382f3..365b65bfd82d 100644
--- a/packages/x-data-grid/src/components/GridSkeletonLoadingOverlay.tsx
+++ b/packages/x-data-grid/src/components/GridSkeletonLoadingOverlay.tsx
@@ -171,7 +171,12 @@ const GridSkeletonLoadingOverlay = React.forwardRef<
         }
 
         if (hasScrollbarFiller) {
-          rowCells.push(<GridScrollbarFillerCell pinnedRight={pinnedColumns.right.length > 0} />);
+          rowCells.push(
+            <GridScrollbarFillerCell
+              key={`skeleton-scrollbar-filler-${i}`}
+              pinnedRight={pinnedColumns.right.length > 0}
+            />,
+          );
         }
       }
 
diff --git a/packages/x-data-grid/src/components/containers/GridRootStyles.ts b/packages/x-data-grid/src/components/containers/GridRootStyles.ts
index 0e76bd7f298f..e35707002cc2 100644
--- a/packages/x-data-grid/src/components/containers/GridRootStyles.ts
+++ b/packages/x-data-grid/src/components/containers/GridRootStyles.ts
@@ -690,11 +690,19 @@ export const GridRootStyles = styled('div', {
       borderTop: '1px solid var(--DataGrid-rowBorderColor)',
     },
 
-    /* Hide grid rows and vertical scrollbar when skeleton overlay is visible */
+    /* Hide grid rows, row filler, and vertical scrollbar when skeleton overlay is visible */
     [`& .${c['main--hasSkeletonLoadingOverlay']}`]: {
-      [`& .${c.virtualScrollerContent}, & .${c['scrollbar--vertical']}, & .${c.pinnedRows}`]: {
-        display: 'none',
+      [`& .${c.virtualScrollerContent}`]: {
+        // We use visibility hidden so that the virtual scroller content retains its height.
+        // Position fixed is used to remove the virtual scroller content from the flow.
+        // https://github.com/mui/mui-x/issues/14061
+        position: 'fixed',
+        visibility: 'hidden',
       },
+      [`& .${c['scrollbar--vertical']}, & .${c.pinnedRows}, & .${c.virtualScroller} > .${c.filler}`]:
+        {
+          display: 'none',
+        },
     },
   };