--- a/browser/components/customizableui/CustomizeMode.jsm
+++ b/browser/components/customizableui/CustomizeMode.jsm
@@ -2355,55 +2355,65 @@ CustomizeMode.prototype = {
              !(CustomizableUI.isSpecialWidget(widget) && widget.includes("spring"))) {
           break;
         }
       }
       CustomizableUI.addWidgetToArea("downloads-button", "nav-bar", insertionPoint);
     }
   },
 
-  _showDownloadsAutoHidePanel() {
+  async _showDownloadsAutoHidePanel() {
     let doc = this.document;
     let panel = doc.getElementById(kDownloadAutohidePanelId);
     panel.hidePopup();
     let button = doc.getElementById("downloads-button");
     // We don't show the tooltip if the button is in the panel.
     if (button.closest("#widget-overflow-fixed-list")) {
       return;
     }
 
+    let offsetX = 0, offsetY = 0;
+    let panelOnTheLeft = false;
+    let toolbarContainer = button.closest("toolbar");
+    if (toolbarContainer && toolbarContainer.id == "nav-bar") {
+      let navbarWidgets = CustomizableUI.getWidgetIdsInArea("nav-bar");
+      if (navbarWidgets.indexOf("urlbar-container") <= navbarWidgets.indexOf("downloads-button")) {
+        panelOnTheLeft = true;
+      }
+    } else {
+      await BrowserUtils.promiseLayoutFlushed(doc, "display", () => {});
+      if (!this._customizing || !this._wantToBeInCustomizeMode) {
+        return;
+      }
+      let buttonBounds = this._dwu.getBoundsWithoutFlushing(button);
+      let windowBounds = this._dwu.getBoundsWithoutFlushing(doc.documentElement);
+      panelOnTheLeft = (buttonBounds.left + buttonBounds.width / 2) > windowBounds.width / 2;
+    }
+    let position;
+    if (panelOnTheLeft) {
+      // Tested in RTL, these get inverted automatically, so this does the
+      // right thing without taking RTL into account explicitly.
+      position = "leftcenter topright";
+      if (toolbarContainer) {
+        offsetX = 8;
+      }
+    } else {
+      position = "rightcenter topleft";
+      if (toolbarContainer) {
+        offsetX = -8;
+      }
+    }
+
     let checkbox = doc.getElementById(kDownloadAutohideCheckboxId);
     if (this.window.DownloadsButton.autoHideDownloadsButton) {
       checkbox.setAttribute("checked", "true");
     } else {
       checkbox.removeAttribute("checked");
     }
 
-    let offsetX = 0, offsetY = 0;
-    let position;
-    if (button.closest("#nav-bar")) {
-      let navbarWidgets = CustomizableUI.getWidgetIdsInArea("nav-bar");
-      if (navbarWidgets.indexOf("urlbar-container") > navbarWidgets.indexOf("downloads-button")) {
-        // Tested in RTL, these get inverted automatically, so this does the
-        // right thing without taking RTL into account explicitly.
-        position = "rightcenter topleft";
-        offsetX = -8;
-      } else {
-        position = "leftcenter topright";
-        offsetX = 8;
-      }
-    } else if (button.closest("#customization-palette")) {
-      position = "topcenter bottomleft";
-      offsetY = 10;
-    } else {
-      // For non-navbar toolbars, this works better than guessing whether
-      // left or right is a better place to position:
-      position = "bottomcenter topleft";
-      offsetY = -5;
-    }
     // We don't use the icon to anchor because it might be resizing because of
     // the animations for drag/drop. Hence the use of offsets.
     panel.openPopup(button, position, offsetX, offsetY);
   },
 
   onDownloadsAutoHideChange(event) {
     let checkbox = event.target.ownerDocument.getElementById(kDownloadAutohideCheckboxId);
     Services.prefs.setBoolPref(kDownloadAutoHidePref, checkbox.checked);