diff --git a/packages/react-drag-drop/src/next/components/DragDrop/DragDropSort.tsx b/packages/react-drag-drop/src/next/components/DragDrop/DragDropSort.tsx
index ea575265b8b..6a803ae0009 100644
--- a/packages/react-drag-drop/src/next/components/DragDrop/DragDropSort.tsx
+++ b/packages/react-drag-drop/src/next/components/DragDrop/DragDropSort.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { createPortal } from 'react-dom';
 import { css } from '@patternfly/react-styles';
 import {
   DndContext,
@@ -159,7 +160,7 @@ export const DragDropSort: React.FunctionComponent<DragDropSortProps> = ({
             );
         }
       })}
-      <DragOverlay>{activeId && getDragOverlay()}</DragOverlay>
+      {createPortal(<DragOverlay>{activeId && getDragOverlay()}</DragOverlay>, document.getElementById('root'))}
     </SortableContext>
   );