diff --git a/apps/web/src/controllers/DashboardController/DashboardViewDashboardController/DashboardContentController/DashboardMetricItem/MetricItemCardThreeDotMenu.tsx b/apps/web/src/controllers/DashboardController/DashboardViewDashboardController/DashboardContentController/DashboardMetricItem/MetricItemCardThreeDotMenu.tsx
index 3b53a0039..c433d393b 100644
--- a/apps/web/src/controllers/DashboardController/DashboardViewDashboardController/DashboardContentController/DashboardMetricItem/MetricItemCardThreeDotMenu.tsx
+++ b/apps/web/src/controllers/DashboardController/DashboardViewDashboardController/DashboardContentController/DashboardMetricItem/MetricItemCardThreeDotMenu.tsx
@@ -99,7 +99,13 @@ const MetricItemCardThreeDotMenuPopover: React.FC<{
         e.stopPropagation();
         e.preventDefault();
       }}
-      className={cn('hidden w-8.5 rounded group-hover:block', className, isOpen && 'block')}>
+      className={cn(
+        // Use opacity and pointer-events instead of display:none to maintain positioning context
+        'w-8.5 rounded transition-opacity duration-75',
+        'pointer-events-none opacity-0 group-hover:pointer-events-auto group-hover:opacity-100',
+        className,
+        isOpen && 'pointer-events-auto opacity-100'
+      )}>
       <div className="absolute right-1.5">
         <Dropdown items={dropdownItems} side="top" align="end" onOpenChange={setIsOpen}>
           {children}