diff --git a/packages/x-data-grid-pro/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx b/packages/x-data-grid-pro/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
index 71a016ae27b5b..af3e87316cc55 100644
--- a/packages/x-data-grid-pro/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
+++ b/packages/x-data-grid-pro/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
@@ -142,7 +142,7 @@ export const useGridColumnHeaders = (props: UseGridColumnHeadersProps) => {
         pinnedPosition,
         indexInSection,
         sectionLength,
-        rootProps.showCellVerticalBorder,
+        rootProps.showColumnVerticalBorder,
         gridHasFiller,
       );
 
diff --git a/packages/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx b/packages/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
index ff382271dd348..d0777a67581d9 100644
--- a/packages/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
+++ b/packages/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
@@ -259,7 +259,7 @@ export const useGridColumnHeaders = (props: UseGridColumnHeadersProps) => {
         pinnedPosition,
         indexInSection,
         sectionLength,
-        rootProps.showCellVerticalBorder,
+        rootProps.showColumnVerticalBorder,
         gridHasFiller,
       );
 
@@ -442,7 +442,7 @@ export const useGridColumnHeaders = (props: UseGridColumnHeadersProps) => {
             pinnedPosition,
             indexInSection,
             visibleColumnGroupHeader.length,
-            rootProps.showCellVerticalBorder,
+            rootProps.showColumnVerticalBorder,
             gridHasFiller,
           )}
         />
diff --git a/test/regressions/data-grid/DataGridBorderedCells.js b/test/regressions/data-grid/DataGridBorderedCells.js
new file mode 100644
index 0000000000000..e76dae9bdf65a
--- /dev/null
+++ b/test/regressions/data-grid/DataGridBorderedCells.js
@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { DataGridPro } from '@mui/x-data-grid-pro';
+import { randomTraderName, randomEmail } from '@mui/x-data-grid-generator';
+
+const columns = [
+  { field: 'name', headerName: 'Name', width: 160 },
+  { field: 'email', headerName: 'Email', width: 200 },
+  { field: 'age', headerName: 'Age', type: 'number' },
+];
+
+const rows = [
+  {
+    id: 1,
+    name: randomTraderName(),
+    email: randomEmail(),
+    age: 25,
+  },
+];
+
+export default function DataGridBordered() {
+  return (
+    <div style={{ height: 400, width: '100%' }}>
+      <DataGridPro rows={rows} columns={columns} showCellVerticalBorder />
+    </div>
+  );
+}
diff --git a/test/regressions/data-grid/DataGridBorderedColumns.js b/test/regressions/data-grid/DataGridBorderedColumns.js
new file mode 100644
index 0000000000000..2e18f9953292d
--- /dev/null
+++ b/test/regressions/data-grid/DataGridBorderedColumns.js
@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { DataGridPro } from '@mui/x-data-grid-pro';
+import { randomTraderName, randomEmail } from '@mui/x-data-grid-generator';
+
+const columns = [
+  { field: 'name', headerName: 'Name', width: 160 },
+  { field: 'email', headerName: 'Email', width: 200 },
+  { field: 'age', headerName: 'Age', type: 'number' },
+];
+
+const rows = [
+  {
+    id: 1,
+    name: randomTraderName(),
+    email: randomEmail(),
+    age: 25,
+  },
+];
+
+export default function DataGridBordered() {
+  return (
+    <div style={{ height: 400, width: '100%' }}>
+      <DataGridPro rows={rows} columns={columns} showColumnVerticalBorder />
+    </div>
+  );
+}