diff --git a/src/components/datagrid/_data_grid_data_row.scss b/src/components/datagrid/_data_grid_data_row.scss
index 833e5efbab8..cfaa2a9095b 100644
--- a/src/components/datagrid/_data_grid_data_row.scss
+++ b/src/components/datagrid/_data_grid_data_row.scss
@@ -38,6 +38,22 @@
       animation-delay: $euiAnimSpeedNormal;
       animation-fill-mode: forwards;
     }
+    /*
+     * For some incredibly bizarre reason, Safari doesn't correctly update the flex
+     * width of the content (when rows are an undefined height/single flex row),
+     * which causes the action icons to overlap & makes the content less readable.
+     * This workaround "animation" forces a rerender of the flex content width
+     *
+     * TODO: Remove this workaround once https://bugs.webkit.org/show_bug.cgi?id=258539 is resolved
+     */
+    .euiDataGridRowCell__expandContent {
+      animation-name: euiDataGridCellActionsSafariWorkaround;
+      animation-duration: 1000ms; // I don't know why the duration matters or why it being longer works more consistently 🥲
+      animation-delay: $euiAnimSpeedNormal + $euiAnimSpeedExtraFast; // Wait for above animation to finish
+      animation-iteration-count: 1;
+      animation-fill-mode: forwards;
+      animation-timing-function: linear;
+    }
   }
 
   // On focus, directly show action buttons (without animation)
@@ -243,3 +259,14 @@
     width: $euiSizeM;
   }
 }
+@keyframes euiDataGridCellActionsSafariWorkaround {
+  from {
+    width: 100%;
+    flex-basis: 100%;
+  }
+
+  to {
+    width: auto;
+    flex-basis: auto;
+  }
+}
diff --git a/upcoming_changelogs/6881.md b/upcoming_changelogs/6881.md
new file mode 100644
index 00000000000..fd4064125ee
--- /dev/null
+++ b/upcoming_changelogs/6881.md
@@ -0,0 +1,3 @@
+**Bug fixes**
+
+- Fixed Safari-only bug for single-line row `EuiDataGrid`s, where cell actions on hover would overlap instead of pushing content to the left