diff --git a/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap b/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap
index e0433fb8303..63fa99ebb2b 100644
--- a/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap
+++ b/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap
@@ -610,21 +610,21 @@ exports[`EuiDataGrid rendering renders additional toolbar controls 1`] = `
                   data-test-subj="dataGridColumnResizer"
                   style="margin-right: 0px;"
                 />
-                <div
-                  class="euiPopover eui-fullWidth emotion-euiPopover-block"
+                <button
+                  aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+                  class="euiDataGridHeaderCell__button"
+                  data-euigrid-tab-managed="true"
+                  tabindex="-1"
                 >
-                  <button
-                    aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-                    class="euiDataGridHeaderCell__button"
-                    data-euigrid-tab-managed="true"
-                    tabindex="-1"
+                  <div
+                    class="euiDataGridHeaderCell__content"
+                    title="A"
+                  >
+                    A
+                  </div>
+                  <div
+                    class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
                   >
-                    <div
-                      class="euiDataGridHeaderCell__content"
-                      title="A"
-                    >
-                      A
-                    </div>
                     <div
                       class="euiDataGridHeaderCell__icon"
                     >
@@ -634,8 +634,8 @@ exports[`EuiDataGrid rendering renders additional toolbar controls 1`] = `
                         data-test-subj="dataGridHeaderCellActionButton-A"
                       />
                     </div>
-                  </button>
-                </div>
+                  </div>
+                </button>
                 <p
                   hidden=""
                   id="euiDataGridCellHeader_generated-id_sorting"
@@ -663,21 +663,21 @@ exports[`EuiDataGrid rendering renders additional toolbar controls 1`] = `
                   data-test-subj="dataGridColumnResizer"
                   style="margin-right: 0px;"
                 />
-                <div
-                  class="euiPopover eui-fullWidth emotion-euiPopover-block"
+                <button
+                  aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+                  class="euiDataGridHeaderCell__button"
+                  data-euigrid-tab-managed="true"
+                  tabindex="-1"
                 >
-                  <button
-                    aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-                    class="euiDataGridHeaderCell__button"
-                    data-euigrid-tab-managed="true"
-                    tabindex="-1"
+                  <div
+                    class="euiDataGridHeaderCell__content"
+                    title="B"
+                  >
+                    B
+                  </div>
+                  <div
+                    class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
                   >
-                    <div
-                      class="euiDataGridHeaderCell__content"
-                      title="B"
-                    >
-                      B
-                    </div>
                     <div
                       class="euiDataGridHeaderCell__icon"
                     >
@@ -687,8 +687,8 @@ exports[`EuiDataGrid rendering renders additional toolbar controls 1`] = `
                         data-test-subj="dataGridHeaderCellActionButton-B"
                       />
                     </div>
-                  </button>
-                </div>
+                  </div>
+                </button>
                 <p
                   hidden=""
                   id="euiDataGridCellHeader_generated-id_sorting"
@@ -1056,21 +1056,21 @@ exports[`EuiDataGrid rendering renders control columns 1`] = `
                   data-test-subj="dataGridColumnResizer"
                   style="margin-right: 0px;"
                 />
-                <div
-                  class="euiPopover eui-fullWidth emotion-euiPopover-block"
+                <button
+                  aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+                  class="euiDataGridHeaderCell__button"
+                  data-euigrid-tab-managed="true"
+                  tabindex="-1"
                 >
-                  <button
-                    aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-                    class="euiDataGridHeaderCell__button"
-                    data-euigrid-tab-managed="true"
-                    tabindex="-1"
+                  <div
+                    class="euiDataGridHeaderCell__content"
+                    title="A"
+                  >
+                    A
+                  </div>
+                  <div
+                    class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
                   >
-                    <div
-                      class="euiDataGridHeaderCell__content"
-                      title="A"
-                    >
-                      A
-                    </div>
                     <div
                       class="euiDataGridHeaderCell__icon"
                     >
@@ -1080,8 +1080,8 @@ exports[`EuiDataGrid rendering renders control columns 1`] = `
                         data-test-subj="dataGridHeaderCellActionButton-A"
                       />
                     </div>
-                  </button>
-                </div>
+                  </div>
+                </button>
                 <p
                   hidden=""
                   id="euiDataGridCellHeader_generated-id_sorting"
@@ -1109,21 +1109,21 @@ exports[`EuiDataGrid rendering renders control columns 1`] = `
                   data-test-subj="dataGridColumnResizer"
                   style="margin-right: 0px;"
                 />
-                <div
-                  class="euiPopover eui-fullWidth emotion-euiPopover-block"
+                <button
+                  aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+                  class="euiDataGridHeaderCell__button"
+                  data-euigrid-tab-managed="true"
+                  tabindex="-1"
                 >
-                  <button
-                    aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-                    class="euiDataGridHeaderCell__button"
-                    data-euigrid-tab-managed="true"
-                    tabindex="-1"
+                  <div
+                    class="euiDataGridHeaderCell__content"
+                    title="B"
+                  >
+                    B
+                  </div>
+                  <div
+                    class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
                   >
-                    <div
-                      class="euiDataGridHeaderCell__content"
-                      title="B"
-                    >
-                      B
-                    </div>
                     <div
                       class="euiDataGridHeaderCell__icon"
                     >
@@ -1133,8 +1133,8 @@ exports[`EuiDataGrid rendering renders control columns 1`] = `
                         data-test-subj="dataGridHeaderCellActionButton-B"
                       />
                     </div>
-                  </button>
-                </div>
+                  </div>
+                </button>
                 <p
                   hidden=""
                   id="euiDataGridCellHeader_generated-id_sorting"
@@ -1739,21 +1739,21 @@ exports[`EuiDataGrid rendering renders custom column headers 1`] = `
                   data-test-subj="dataGridColumnResizer"
                   style="margin-right: 0px;"
                 />
-                <div
-                  class="euiPopover eui-fullWidth emotion-euiPopover-block"
+                <button
+                  aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+                  class="euiDataGridHeaderCell__button"
+                  data-euigrid-tab-managed="true"
+                  tabindex="-1"
                 >
-                  <button
-                    aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-                    class="euiDataGridHeaderCell__button"
-                    data-euigrid-tab-managed="true"
-                    tabindex="-1"
+                  <div
+                    class="euiDataGridHeaderCell__content"
+                    title="A"
+                  >
+                    Column A
+                  </div>
+                  <div
+                    class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
                   >
-                    <div
-                      class="euiDataGridHeaderCell__content"
-                      title="A"
-                    >
-                      Column A
-                    </div>
                     <div
                       class="euiDataGridHeaderCell__icon"
                     >
@@ -1763,8 +1763,8 @@ exports[`EuiDataGrid rendering renders custom column headers 1`] = `
                         data-test-subj="dataGridHeaderCellActionButton-A"
                       />
                     </div>
-                  </button>
-                </div>
+                  </div>
+                </button>
                 <p
                   hidden=""
                   id="euiDataGridCellHeader_generated-id_sorting"
@@ -1792,23 +1792,23 @@ exports[`EuiDataGrid rendering renders custom column headers 1`] = `
                   data-test-subj="dataGridColumnResizer"
                   style="margin-right: 0px;"
                 />
-                <div
-                  class="euiPopover eui-fullWidth emotion-euiPopover-block"
+                <button
+                  aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+                  class="euiDataGridHeaderCell__button"
+                  data-euigrid-tab-managed="true"
+                  tabindex="-1"
                 >
-                  <button
-                    aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-                    class="euiDataGridHeaderCell__button"
-                    data-euigrid-tab-managed="true"
-                    tabindex="-1"
+                  <div
+                    class="euiDataGridHeaderCell__content"
+                    title="B"
                   >
-                    <div
-                      class="euiDataGridHeaderCell__content"
-                      title="B"
-                    >
-                      <div>
-                        More Elements
-                      </div>
+                    <div>
+                      More Elements
                     </div>
+                  </div>
+                  <div
+                    class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
+                  >
                     <div
                       class="euiDataGridHeaderCell__icon"
                     >
@@ -1818,8 +1818,8 @@ exports[`EuiDataGrid rendering renders custom column headers 1`] = `
                         data-test-subj="dataGridHeaderCellActionButton-B"
                       />
                     </div>
-                  </button>
-                </div>
+                  </div>
+                </button>
                 <p
                   hidden=""
                   id="euiDataGridCellHeader_generated-id_sorting"
@@ -2165,21 +2165,21 @@ exports[`EuiDataGrid rendering renders with common and div attributes 1`] = `
                   data-test-subj="dataGridColumnResizer"
                   style="margin-right: 0px;"
                 />
-                <div
-                  class="euiPopover eui-fullWidth emotion-euiPopover-block"
+                <button
+                  aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+                  class="euiDataGridHeaderCell__button"
+                  data-euigrid-tab-managed="true"
+                  tabindex="-1"
                 >
-                  <button
-                    aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-                    class="euiDataGridHeaderCell__button"
-                    data-euigrid-tab-managed="true"
-                    tabindex="-1"
+                  <div
+                    class="euiDataGridHeaderCell__content"
+                    title="A"
+                  >
+                    A
+                  </div>
+                  <div
+                    class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
                   >
-                    <div
-                      class="euiDataGridHeaderCell__content"
-                      title="A"
-                    >
-                      A
-                    </div>
                     <div
                       class="euiDataGridHeaderCell__icon"
                     >
@@ -2189,8 +2189,8 @@ exports[`EuiDataGrid rendering renders with common and div attributes 1`] = `
                         data-test-subj="dataGridHeaderCellActionButton-A"
                       />
                     </div>
-                  </button>
-                </div>
+                  </div>
+                </button>
                 <p
                   hidden=""
                   id="euiDataGridCellHeader_generated-id_sorting"
@@ -2218,21 +2218,21 @@ exports[`EuiDataGrid rendering renders with common and div attributes 1`] = `
                   data-test-subj="dataGridColumnResizer"
                   style="margin-right: 0px;"
                 />
-                <div
-                  class="euiPopover eui-fullWidth emotion-euiPopover-block"
+                <button
+                  aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+                  class="euiDataGridHeaderCell__button"
+                  data-euigrid-tab-managed="true"
+                  tabindex="-1"
                 >
-                  <button
-                    aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-                    class="euiDataGridHeaderCell__button"
-                    data-euigrid-tab-managed="true"
-                    tabindex="-1"
+                  <div
+                    class="euiDataGridHeaderCell__content"
+                    title="B"
+                  >
+                    B
+                  </div>
+                  <div
+                    class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
                   >
-                    <div
-                      class="euiDataGridHeaderCell__content"
-                      title="B"
-                    >
-                      B
-                    </div>
                     <div
                       class="euiDataGridHeaderCell__icon"
                     >
@@ -2242,8 +2242,8 @@ exports[`EuiDataGrid rendering renders with common and div attributes 1`] = `
                         data-test-subj="dataGridHeaderCellActionButton-B"
                       />
                     </div>
-                  </button>
-                </div>
+                  </div>
+                </button>
                 <p
                   hidden=""
                   id="euiDataGridCellHeader_generated-id_sorting"
diff --git a/src/components/datagrid/body/__snapshots__/data_grid_body_custom.test.tsx.snap b/src/components/datagrid/body/__snapshots__/data_grid_body_custom.test.tsx.snap
index ce1b952cb4d..16e1995b214 100644
--- a/src/components/datagrid/body/__snapshots__/data_grid_body_custom.test.tsx.snap
+++ b/src/components/datagrid/body/__snapshots__/data_grid_body_custom.test.tsx.snap
@@ -25,21 +25,21 @@ exports[`EuiDataGridBodyCustomRender treats \`renderCustomGridBody\` as a render
         data-test-subj="dataGridColumnResizer"
         style="margin-right: 0px;"
       />
-      <div
-        class="euiPopover eui-fullWidth emotion-euiPopover-block"
+      <button
+        aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+        class="euiDataGridHeaderCell__button"
+        data-euigrid-tab-managed="true"
+        tabindex="-1"
       >
-        <button
-          aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-          class="euiDataGridHeaderCell__button"
-          data-euigrid-tab-managed="true"
-          tabindex="-1"
+        <div
+          class="euiDataGridHeaderCell__content"
+          title="columnA"
+        >
+          columnA
+        </div>
+        <div
+          class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
         >
-          <div
-            class="euiDataGridHeaderCell__content"
-            title="columnA"
-          >
-            columnA
-          </div>
           <div
             class="euiDataGridHeaderCell__icon"
           >
@@ -49,8 +49,8 @@ exports[`EuiDataGridBodyCustomRender treats \`renderCustomGridBody\` as a render
               data-test-subj="dataGridHeaderCellActionButton-columnA"
             />
           </div>
-        </button>
-      </div>
+        </div>
+      </button>
       <p
         hidden=""
         id="euiDataGridCellHeader_generated-id_sorting"
@@ -78,21 +78,21 @@ exports[`EuiDataGridBodyCustomRender treats \`renderCustomGridBody\` as a render
         data-test-subj="dataGridColumnResizer"
         style="margin-right: 0px;"
       />
-      <div
-        class="euiPopover eui-fullWidth emotion-euiPopover-block"
+      <button
+        aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+        class="euiDataGridHeaderCell__button"
+        data-euigrid-tab-managed="true"
+        tabindex="-1"
       >
-        <button
-          aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-          class="euiDataGridHeaderCell__button"
-          data-euigrid-tab-managed="true"
-          tabindex="-1"
+        <div
+          class="euiDataGridHeaderCell__content"
+          title="columnB"
+        >
+          columnB
+        </div>
+        <div
+          class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
         >
-          <div
-            class="euiDataGridHeaderCell__content"
-            title="columnB"
-          >
-            columnB
-          </div>
           <div
             class="euiDataGridHeaderCell__icon"
           >
@@ -102,8 +102,8 @@ exports[`EuiDataGridBodyCustomRender treats \`renderCustomGridBody\` as a render
               data-test-subj="dataGridHeaderCellActionButton-columnB"
             />
           </div>
-        </button>
-      </div>
+        </div>
+      </button>
       <p
         hidden=""
         id="euiDataGridCellHeader_generated-id_sorting"
diff --git a/src/components/datagrid/body/__snapshots__/data_grid_body_virtualized.test.tsx.snap b/src/components/datagrid/body/__snapshots__/data_grid_body_virtualized.test.tsx.snap
index 136a1d28110..be2f25d5c57 100644
--- a/src/components/datagrid/body/__snapshots__/data_grid_body_virtualized.test.tsx.snap
+++ b/src/components/datagrid/body/__snapshots__/data_grid_body_virtualized.test.tsx.snap
@@ -29,21 +29,21 @@ exports[`EuiDataGridBodyVirtualized renders 1`] = `
           data-test-subj="dataGridColumnResizer"
           style="margin-right: 0px;"
         />
-        <div
-          class="euiPopover eui-fullWidth emotion-euiPopover-block"
+        <button
+          aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+          class="euiDataGridHeaderCell__button"
+          data-euigrid-tab-managed="true"
+          tabindex="-1"
         >
-          <button
-            aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-            class="euiDataGridHeaderCell__button"
-            data-euigrid-tab-managed="true"
-            tabindex="-1"
+          <div
+            class="euiDataGridHeaderCell__content"
+            title="columnA"
+          >
+            columnA
+          </div>
+          <div
+            class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
           >
-            <div
-              class="euiDataGridHeaderCell__content"
-              title="columnA"
-            >
-              columnA
-            </div>
             <div
               class="euiDataGridHeaderCell__icon"
             >
@@ -53,8 +53,8 @@ exports[`EuiDataGridBodyVirtualized renders 1`] = `
                 data-test-subj="dataGridHeaderCellActionButton-columnA"
               />
             </div>
-          </button>
-        </div>
+          </div>
+        </button>
         <p
           hidden=""
           id="euiDataGridCellHeader_generated-id_sorting"
@@ -82,21 +82,21 @@ exports[`EuiDataGridBodyVirtualized renders 1`] = `
           data-test-subj="dataGridColumnResizer"
           style="margin-right: 0px;"
         />
-        <div
-          class="euiPopover eui-fullWidth emotion-euiPopover-block"
+        <button
+          aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+          class="euiDataGridHeaderCell__button"
+          data-euigrid-tab-managed="true"
+          tabindex="-1"
         >
-          <button
-            aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-            class="euiDataGridHeaderCell__button"
-            data-euigrid-tab-managed="true"
-            tabindex="-1"
+          <div
+            class="euiDataGridHeaderCell__content"
+            title="columnB"
+          >
+            columnB
+          </div>
+          <div
+            class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
           >
-            <div
-              class="euiDataGridHeaderCell__content"
-              title="columnB"
-            >
-              columnB
-            </div>
             <div
               class="euiDataGridHeaderCell__icon"
             >
@@ -106,8 +106,8 @@ exports[`EuiDataGridBodyVirtualized renders 1`] = `
                 data-test-subj="dataGridHeaderCellActionButton-columnB"
               />
             </div>
-          </button>
-        </div>
+          </div>
+        </button>
         <p
           hidden=""
           id="euiDataGridCellHeader_generated-id_sorting"
diff --git a/src/components/datagrid/body/header/__snapshots__/data_grid_header_cell.test.tsx.snap b/src/components/datagrid/body/header/__snapshots__/data_grid_header_cell.test.tsx.snap
index 10392536413..69f40b67f99 100644
--- a/src/components/datagrid/body/header/__snapshots__/data_grid_header_cell.test.tsx.snap
+++ b/src/components/datagrid/body/header/__snapshots__/data_grid_header_cell.test.tsx.snap
@@ -17,21 +17,21 @@ exports[`EuiDataGridHeaderCell renders 1`] = `
     data-test-subj="dataGridColumnResizer"
     style="margin-right: 0px;"
   />
-  <div
-    class="euiPopover eui-fullWidth emotion-euiPopover-block"
+  <button
+    aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
+    class="euiDataGridHeaderCell__button"
+    data-euigrid-tab-managed="true"
+    tabindex="-1"
   >
-    <button
-      aria-describedby="euiDataGridCellHeader_generated-id_sorting euiDataGridCellHeader_generated-id_actions"
-      class="euiDataGridHeaderCell__button"
-      data-euigrid-tab-managed="true"
-      tabindex="-1"
+    <div
+      class="euiDataGridHeaderCell__content"
+      title="someColumn"
+    >
+      someColumn
+    </div>
+    <div
+      class="euiPopover emotion-euiPopover-block-EuiDataGridHeaderCell"
     >
-      <div
-        class="euiDataGridHeaderCell__content"
-        title="someColumn"
-      >
-        someColumn
-      </div>
       <div
         class="euiDataGridHeaderCell__icon"
       >
@@ -41,8 +41,8 @@ exports[`EuiDataGridHeaderCell renders 1`] = `
           data-test-subj="dataGridHeaderCellActionButton-someColumn"
         />
       </div>
-    </button>
-  </div>
+    </div>
+  </button>
   <p
     hidden=""
     id="euiDataGridCellHeader_generated-id_sorting"
diff --git a/src/components/datagrid/body/header/data_grid_header_cell.tsx b/src/components/datagrid/body/header/data_grid_header_cell.tsx
index 3b1921ce0ed..fdf687aa110 100644
--- a/src/components/datagrid/body/header/data_grid_header_cell.tsx
+++ b/src/components/datagrid/body/header/data_grid_header_cell.tsx
@@ -80,6 +80,7 @@ export const EuiDataGridHeaderCell: FunctionComponent<
   });
 
   const showColumnActions = columnActions && columnActions.length > 0;
+  const actionsButtonRef = useRef<HTMLButtonElement | null>(null);
 
   const { sortingArrow, ariaSort, sortingScreenReaderText } = useSortingUtils({
     sorting,
@@ -136,21 +137,34 @@ export const EuiDataGridHeaderCell: FunctionComponent<
         </>
       ) : (
         <>
-          <EuiPopover
-            className="eui-fullWidth"
-            display="block"
-            panelPaddingSize="none"
-            offset={7}
-            button={
-              <button
-                className="euiDataGridHeaderCell__button"
-                onClick={() => {
-                  setFocusedCell([index, -1]);
-                  setIsPopoverOpen((isPopoverOpen) => !isPopoverOpen);
-                }}
-                aria-describedby={`${sortingAriaId} ${actionsAriaId}`}
-              >
-                {cellContent}
+          <button
+            className="euiDataGridHeaderCell__button"
+            onClick={() => {
+              setFocusedCell([index, -1]);
+              setIsPopoverOpen((isPopoverOpen) => !isPopoverOpen);
+            }}
+            aria-describedby={`${sortingAriaId} ${actionsAriaId}`}
+            ref={actionsButtonRef}
+          >
+            {cellContent}
+            <EuiPopover
+              display="block"
+              panelPaddingSize="none"
+              offset={7}
+              anchorPosition="downRight"
+              css={{ marginInlineStart: 'auto' }} // Align to right
+              focusTrapProps={{
+                // We need to override the default EuiPopover `onClickOutside` since the anchor is separate from the actual button
+                onClickOutside: (event: Event) => {
+                  if (
+                    actionsButtonRef.current?.contains(event.target as Node) ===
+                    false
+                  ) {
+                    setIsPopoverOpen(false);
+                  }
+                },
+              }}
+              button={
                 <div className="euiDataGridHeaderCell__icon">
                   <EuiIcon
                     type="boxesVertical"
@@ -159,18 +173,18 @@ export const EuiDataGridHeaderCell: FunctionComponent<
                     data-test-subj={`dataGridHeaderCellActionButton-${id}`}
                   />
                 </div>
-              </button>
-            }
-            isOpen={isPopoverOpen}
-            closePopover={() => setIsPopoverOpen(false)}
-            {...popoverArrowNavigationProps}
-          >
-            <EuiListGroup
-              listItems={columnActions}
-              gutterSize="none"
-              data-test-subj={`dataGridHeaderCellActionGroup-${id}`}
-            />
-          </EuiPopover>
+              }
+              isOpen={isPopoverOpen}
+              closePopover={() => setIsPopoverOpen(false)}
+              {...popoverArrowNavigationProps}
+            >
+              <EuiListGroup
+                listItems={columnActions}
+                gutterSize="none"
+                data-test-subj={`dataGridHeaderCellActionGroup-${id}`}
+              />
+            </EuiPopover>
+          </button>
 
           <p id={sortingAriaId} hidden>
             {sortingScreenReaderText}