diff --git a/public/app/core/components/RolePicker/RolePicker.tsx b/public/app/core/components/RolePicker/RolePicker.tsx
index 9c9406ef6fc..f640b9965b1 100644
--- a/public/app/core/components/RolePicker/RolePicker.tsx
+++ b/public/app/core/components/RolePicker/RolePicker.tsx
@@ -64,7 +64,9 @@ export const RolePicker = ({
     let vertical = -offsetVertical;
 
     if (distance < MENU_MAX_HEIGHT + 20) {
-      vertical = offsetVertical;
+      // Off set to display the role picker menu at the bottom of the screen
+      // without resorting to scroll the page
+      vertical = 50 + (MENU_MAX_HEIGHT - distance) - offsetVertical;
     }
 
     /*