--- a/browser/base/content/browser.xul
+++ b/browser/base/content/browser.xul
@@ -1147,17 +1147,17 @@
                     class="subviewbutton panel-subview-footer"
                     label="&showAllBookmarks2.label;"
                     command="Browser:ShowAllBookmarks"
                     key="manBookmarkKb"/>
         </menupopup>
       </toolbarbutton>
 
       <toolbaritem id="search-container"
-                   class="chromeclass-toolbar-additional panel-wide-item"
+                   class="chromeclass-toolbar-additional"
                    title="&searchItem.title;"
                    align="center"
                    flex="100"
                    persist="width">
         <searchbar id="searchbar" flex="1"/>
       </toolbaritem>
     </toolbarpalette>
     <box id="library-animatable-box" class="toolbarbutton-animatable-box">

--- a/browser/components/customizableui/CustomizableUI.jsm
+++ b/browser/components/customizableui/CustomizableUI.jsm
@@ -8,17 +8,16 @@ this.EXPORTED_SYMBOLS = ["CustomizableUI
 
 const {classes: Cc, interfaces: Ci, utils: Cu, results: Cr} = Components;
 
 Cu.import("resource://gre/modules/Services.jsm");
 Cu.import("resource://gre/modules/XPCOMUtils.jsm");
 Cu.import("resource://gre/modules/AppConstants.jsm");
 
 XPCOMUtils.defineLazyModuleGetters(this, {
-  PanelWideWidgetTracker: "resource:///modules/PanelWideWidgetTracker.jsm",
   SearchWidgetTracker: "resource:///modules/SearchWidgetTracker.jsm",
   CustomizableWidgets: "resource:///modules/CustomizableWidgets.jsm",
   DeferredTask: "resource://gre/modules/DeferredTask.jsm",
   PrivateBrowsingUtils: "resource://gre/modules/PrivateBrowsingUtils.jsm",
   ShortcutUtils: "resource://gre/modules/ShortcutUtils.jsm",
   LightweightThemeManager: "resource://gre/modules/LightweightThemeManager.jsm",
 });
 
@@ -3015,25 +3014,16 @@ this.CustomizableUI = {
   SOURCE_BUILTIN: "builtin",
   /**
    * Constant indicating the widget is externally provided
    * (e.g. by add-ons or other items not part of the builtin widget set).
    */
   SOURCE_EXTERNAL: "external",
 
   /**
-   * The class used to distinguish items that span the entire menu panel.
-   */
-  WIDE_PANEL_CLASS: "panel-wide-item",
-  /**
-   * The (constant) number of columns in the menu panel.
-   */
-  PANEL_COLUMN_COUNT: 3,
-
-  /**
    * Constant indicating the reason the event was fired was a window closing
    */
   REASON_WINDOW_CLOSED: "window-closed",
   /**
    * Constant indicating the reason the event was fired was an area being
    * unregistered separately from window closing mechanics.
    */
   REASON_AREA_UNREGISTERED: "area-unregistered",

--- a/browser/components/customizableui/CustomizableWidgets.jsm
+++ b/browser/components/customizableui/CustomizableWidgets.jsm
@@ -29,17 +29,16 @@ XPCOMUtils.defineLazyGetter(this, "Chars
 });
 XPCOMUtils.defineLazyGetter(this, "BrandBundle", function() {
   const kBrandBundle = "chrome://branding/locale/brand.properties";
   return Services.strings.createBundle(kBrandBundle);
 });
 
 const kNSXUL = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
 const kPrefCustomizationDebug = "browser.uiCustomization.debug";
-const kWidePanelItemClass = "panel-wide-item";
 
 XPCOMUtils.defineLazyGetter(this, "log", () => {
   let scope = {};
   Cu.import("resource://gre/modules/Console.jsm", scope);
   let debug = Services.prefs.getBoolPref(kPrefCustomizationDebug, false);
   let consoleOptions = {
     maxLogLevel: debug ? "all" : "log",
     prefix: "CustomizableWidgets",
@@ -621,17 +620,16 @@ const CustomizableWidgets = [
       let node = aDocument.createElementNS(kNSXUL, "toolbaritem");
       node.setAttribute("id", "zoom-controls");
       node.setAttribute("label", CustomizableUI.getLocalizedProperty(this, "label"));
       node.setAttribute("title", CustomizableUI.getLocalizedProperty(this, "tooltiptext"));
       // Set this as an attribute in addition to the property to make sure we can style correctly.
       node.setAttribute("removable", "true");
       node.classList.add("chromeclass-toolbar-additional");
       node.classList.add("toolbaritem-combined-buttons");
-      node.classList.add(kWidePanelItemClass);
 
       buttons.forEach(function(aButton, aIndex) {
         if (aIndex != 0)
           node.appendChild(aDocument.createElementNS(kNSXUL, "separator"));
         let btnNode = aDocument.createElementNS(kNSXUL, "toolbarbutton");
         setAttributes(btnNode, aButton);
         node.appendChild(btnNode);
       });
@@ -669,17 +667,16 @@ const CustomizableWidgets = [
       let node = aDocument.createElementNS(kNSXUL, "toolbaritem");
       node.setAttribute("id", "edit-controls");
       node.setAttribute("label", CustomizableUI.getLocalizedProperty(this, "label"));
       node.setAttribute("title", CustomizableUI.getLocalizedProperty(this, "tooltiptext"));
       // Set this as an attribute in addition to the property to make sure we can style correctly.
       node.setAttribute("removable", "true");
       node.classList.add("chromeclass-toolbar-additional");
       node.classList.add("toolbaritem-combined-buttons");
-      node.classList.add(kWidePanelItemClass);
 
       buttons.forEach(function(aButton, aIndex) {
         if (aIndex != 0)
           node.appendChild(aDocument.createElementNS(kNSXUL, "separator"));
         let btnNode = aDocument.createElementNS(kNSXUL, "toolbarbutton");
         setAttributes(btnNode, aButton);
         node.appendChild(btnNode);
       });

--- a/browser/components/customizableui/CustomizeMode.jsm
+++ b/browser/components/customizableui/CustomizeMode.jsm
@@ -888,24 +888,16 @@ CustomizeMode.prototype = {
       wrapper.setAttribute("title", aNode.getAttribute("title"));
       wrapper.setAttribute("tooltiptext", aNode.getAttribute("title"));
     }
 
     if (aNode.hasAttribute("flex")) {
       wrapper.setAttribute("flex", aNode.getAttribute("flex"));
     }
 
-    if (aPlace == "panel") {
-      if (aNode.classList.contains(CustomizableUI.WIDE_PANEL_CLASS)) {
-        wrapper.setAttribute("haswideitem", "true");
-      } else if (wrapper.hasAttribute("haswideitem")) {
-        wrapper.removeAttribute("haswideitem");
-      }
-    }
-
     let removable = aPlace == "palette" || CustomizableUI.isWidgetRemovable(aNode);
     wrapper.setAttribute("removable", removable);
 
     if (AppConstants.platform == "win") {
       // Allow touch events to initiate dragging in customize mode.
       // This is only supported on Windows for now.
       wrapper.setAttribute("touchdownstartsdrag", "true");
     }
@@ -2257,18 +2249,17 @@ CustomizeMode.prototype = {
   },
 
   _setGridDragActive(aDragOverNode, aDraggedItem, aValue) {
     let targetArea = this._getCustomizableParent(aDragOverNode);
     let draggedWrapper = this.document.getElementById("wrapper-" + aDraggedItem.id);
     let originArea = this._getCustomizableParent(draggedWrapper);
     let positionManager = DragPositionManager.getManagerForArea(targetArea);
     let draggedSize = this._getDragItemSize(aDragOverNode, aDraggedItem);
-    let isWide = aDraggedItem.classList.contains(CustomizableUI.WIDE_PANEL_CLASS);
-    positionManager.insertPlaceholder(targetArea, aDragOverNode, isWide, draggedSize,
+    positionManager.insertPlaceholder(targetArea, aDragOverNode, draggedSize,
                                       originArea == targetArea);
   },
 
   _getDragItemSize(aDragOverNode, aDraggedItem) {
     // Cache it good, cache it real good.
     if (!this._dragSizeMap)
       this._dragSizeMap = new WeakMap();
     if (!this._dragSizeMap.has(aDraggedItem))
@@ -2368,17 +2359,17 @@ CustomizeMode.prototype = {
         targetNode = targetNode.parentNode;
       }
     } else {
       let positionManager = DragPositionManager.getManagerForArea(aAreaElement);
       // Make it relative to the container:
       dragX -= bounds.left;
       dragY -= bounds.top;
       // Find the closest node:
-      targetNode = positionManager.find(aAreaElement, dragX, dragY, aDraggedItemId);
+      targetNode = positionManager.find(aAreaElement, dragX, dragY);
     }
     return targetNode || aEvent.target;
   },
 
   _onMouseDown(aEvent) {
     log.debug("_onMouseDown");
     if (aEvent.button != 0) {
       return;

--- a/browser/components/customizableui/DragPositionManager.jsm
+++ b/browser/components/customizableui/DragPositionManager.jsm
@@ -5,116 +5,92 @@
 "use strict";
 
 Components.utils.import("resource:///modules/CustomizableUI.jsm");
 Components.utils.import("resource://gre/modules/XPCOMUtils.jsm");
 
 var gManagers = new WeakMap();
 
 const kPaletteId = "customization-palette";
-const kPlaceholderClass = "panel-customization-placeholder";
 
 this.EXPORTED_SYMBOLS = ["DragPositionManager"];
 
 function AreaPositionManager(aContainer) {
   // Caching the direction and bounds of the container for quick access later:
   let window = aContainer.ownerGlobal;
   this._dir = window.getComputedStyle(aContainer).direction;
   let containerRect = aContainer.getBoundingClientRect();
   this._containerInfo = {
     left: containerRect.left,
     right: containerRect.right,
     top: containerRect.top,
     width: containerRect.width
   };
-  this._inPanel = aContainer.id == CustomizableUI.AREA_PANEL;
   this._horizontalDistance = null;
   this.update(aContainer);
 }
 
 AreaPositionManager.prototype = {
   _nodePositionStore: null,
-  _wideCache: null,
 
   update(aContainer) {
     this._nodePositionStore = new WeakMap();
-    this._wideCache = new Set();
     let last = null;
     let singleItemHeight;
     for (let child of aContainer.children) {
       if (child.hidden) {
         continue;
       }
-      let isNodeWide = this._checkIfWide(child);
-      if (isNodeWide) {
-        this._wideCache.add(child.id);
-      }
       let coordinates = this._lazyStoreGet(child);
-      // We keep a baseline horizontal distance between non-wide nodes around
+      // We keep a baseline horizontal distance between nodes around
       // for use when we can't compare with previous/next nodes
-      if (!this._horizontalDistance && last && !isNodeWide) {
+      if (!this._horizontalDistance && last) {
         this._horizontalDistance = coordinates.left - last.left;
       }
-      // We also keep the basic height of non-wide items for use below:
-      if (!isNodeWide && !singleItemHeight) {
+      // We also keep the basic height of items for use below:
+      if (!singleItemHeight) {
         singleItemHeight = coordinates.height;
       }
-      last = !isNodeWide ? coordinates : null;
+      last = coordinates;
     }
-    if (this._inPanel) {
-      this._heightToWidthFactor = CustomizableUI.PANEL_COLUMN_COUNT;
-    } else {
-      this._heightToWidthFactor = this._containerInfo.width / singleItemHeight;
-    }
+    this._heightToWidthFactor = this._containerInfo.width / singleItemHeight;
   },
 
   /**
    * Find the closest node in the container given the coordinates.
    * "Closest" is defined in a somewhat strange manner: we prefer nodes
    * which are in the same row over nodes that are in a different row.
    * In order to implement this, we use a weighted cartesian distance
    * where dy is more heavily weighted by a factor corresponding to the
    * ratio between the container's width and the height of its elements.
    */
-  find(aContainer, aX, aY, aDraggedItemId) {
+  find(aContainer, aX, aY) {
     let closest = null;
     let minCartesian = Number.MAX_VALUE;
     let containerX = this._containerInfo.left;
     let containerY = this._containerInfo.top;
     for (let node of aContainer.children) {
       let coordinates = this._lazyStoreGet(node);
       let offsetX = coordinates.x - containerX;
       let offsetY = coordinates.y - containerY;
       let hDiff = offsetX - aX;
       let vDiff = offsetY - aY;
-      // For wide widgets, we're always going to be further from the center
-      // horizontally. Compensate:
-      if (this.isWide(node)) {
-        hDiff /= CustomizableUI.PANEL_COLUMN_COUNT;
-      }
       // Then compensate for the height/width ratio so that we prefer items
       // which are in the same row:
       hDiff /= this._heightToWidthFactor;
 
       let cartesianDiff = hDiff * hDiff + vDiff * vDiff;
       if (cartesianDiff < minCartesian) {
         minCartesian = cartesianDiff;
         closest = node;
       }
     }
 
     // Now correct this node based on what we're dragging
     if (closest) {
-      let doc = aContainer.ownerDocument;
-      let draggedItem = doc.getElementById(aDraggedItemId);
-      // If dragging a wide item, always pick the first item in a row:
-      if (this._inPanel && draggedItem &&
-          draggedItem.classList.contains(CustomizableUI.WIDE_PANEL_CLASS)) {
-        return this._firstInRow(closest);
-      }
       let targetBounds = this._lazyStoreGet(closest);
       let farSide = this._dir == "ltr" ? "right" : "left";
       let outsideX = targetBounds[farSide];
       // Check if we're closer to the next target than to this one:
       // Only move if we're not targeting a node in a different row:
       if (aY > targetBounds.top && aY < targetBounds.bottom) {
         if ((this._dir == "ltr" && aX > outsideX) ||
             (this._dir == "rtl" && aX < outsideX)) {
@@ -126,80 +102,52 @@ AreaPositionManager.prototype = {
   },
 
   /**
    * "Insert" a "placeholder" by shifting the subsequent children out of the
    * way. We go through all the children, and shift them based on the position
    * they would have if we had inserted something before aBefore. We use CSS
    * transforms for this, which are CSS transitioned.
    */
-  insertPlaceholder(aContainer, aBefore, aWide, aSize, aIsFromThisArea) {
+  insertPlaceholder(aContainer, aBefore, aSize, aIsFromThisArea) {
     let isShifted = false;
-    let shiftDown = aWide;
     for (let child of aContainer.children) {
       // Don't need to shift hidden nodes:
       if (child.getAttribute("hidden") == "true") {
         continue;
       }
       // If this is the node before which we're inserting, start shifting
       // everything that comes after. One exception is inserting at the end
       // of the menupanel, in which case we do not shift the placeholders:
-      if (child == aBefore && !child.classList.contains(kPlaceholderClass)) {
+      if (child == aBefore) {
         isShifted = true;
-        // If the node before which we're inserting is wide, we should
-        // shift everything one row down:
-        if (!shiftDown && this.isWide(child)) {
-          shiftDown = true;
-        }
-      }
-      // If we're moving items before a wide node that were already there,
-      // it's possible it's not necessary to shift nodes
-      // including & after the wide node.
-      if (this.__undoShift) {
-        isShifted = false;
       }
       if (isShifted) {
-        // Conversely, if we're adding something before a wide node, for
-        // simplicity's sake we move everything including the wide node down:
-        if (this.__moveDown) {
-          shiftDown = true;
-        }
         if (aIsFromThisArea && !this._lastPlaceholderInsertion) {
           child.setAttribute("notransition", "true");
         }
         // Determine the CSS transform based on the next node:
-        child.style.transform = this._getNextPos(child, shiftDown, aSize);
+        child.style.transform = this._diffWithNext(child, aSize);
       } else {
         // If we're not shifting this node, reset the transform
         child.style.transform = "";
       }
     }
     if (aContainer.lastChild && aIsFromThisArea &&
         !this._lastPlaceholderInsertion) {
       // Flush layout:
       aContainer.lastChild.getBoundingClientRect();
       // then remove all the [notransition]
       for (let child of aContainer.children) {
         child.removeAttribute("notransition");
       }
     }
-    delete this.__moveDown;
-    delete this.__undoShift;
     this._lastPlaceholderInsertion = aBefore;
   },
 
-  isWide(aNode) {
-    return this._wideCache.has(aNode.id);
-  },
-
-  _checkIfWide(aNode) {
-    return this._inPanel && aNode && aNode.firstChild &&
-           aNode.firstChild.classList.contains(CustomizableUI.WIDE_PANEL_CLASS);
-  },
-
   /**
    * Reset all the transforms in this container, optionally without
    * transitioning them.
    * @param aContainer    the container in which to reset transforms
    * @param aNoTransition if truthy, adds a notransition attribute to the node
    *                      while resetting the transform.
    */
   clearPlaceholders(aContainer, aNoTransition) {
@@ -216,71 +164,37 @@ AreaPositionManager.prototype = {
     }
     // We snapped back, so we can assume there's no more
     // "last" placeholder insertion point to keep track of.
     if (aNoTransition) {
       this._lastPlaceholderInsertion = null;
     }
   },
 
-  _getNextPos(aNode, aShiftDown, aSize) {
-    // Shifting down is easy:
-    if (this._inPanel && aShiftDown) {
-      return "translate(0, " + aSize.height + "px)";
-    }
-    return this._diffWithNext(aNode, aSize);
-  },
-
   _diffWithNext(aNode, aSize) {
     let xDiff;
     let yDiff = null;
     let nodeBounds = this._lazyStoreGet(aNode);
     let side = this._dir == "ltr" ? "left" : "right";
     let next = this._getVisibleSiblingForDirection(aNode, "next");
     // First we determine the transform along the x axis.
     // Usually, there will be a next node to base this on:
     if (next) {
       let otherBounds = this._lazyStoreGet(next);
       xDiff = otherBounds[side] - nodeBounds[side];
-      // If the next node is a wide item in the panel, check if we could maybe
-      // just move further out in the same row, without snapping to the next
-      // one. This happens, for example, if moving an item that's before a wide
-      // node within its own row of items. There will be space to drop this
-      // item within the row, and the rest of the items do not need to shift.
-      if (this.isWide(next)) {
-        let otherXDiff = this._moveNextBasedOnPrevious(aNode, nodeBounds,
-                                                       this._firstInRow(aNode));
-        // If this has the same sign as our original shift, we're still
-        // snapping to the start of the row. In this case, we should move
-        // everything after us a row down, so as not to display two nodes on
-        // top of each other:
-        // (we would be able to get away with checking for equality instead of
-        //  equal signs here, but one of these is based on the x coordinate of
-        //  the first item in row N and one on that for row N - 1, so this is
-        //  safer, as their margins might differ)
-        if ((otherXDiff < 0) == (xDiff < 0)) {
-          this.__moveDown = true;
-        } else {
-          // Otherwise, we succeeded and can move further out. This also means
-          // we can stop shifting the rest of the content:
-          xDiff = otherXDiff;
-          this.__undoShift = true;
-        }
-      } else {
-        // We set this explicitly because otherwise some strange difference
-        // between the height and the actual difference between line creeps in
-        // and messes with alignments
-        yDiff = otherBounds.top - nodeBounds.top;
-      }
+      // We set this explicitly because otherwise some strange difference
+      // between the height and the actual difference between line creeps in
+      // and messes with alignments
+      yDiff = otherBounds.top - nodeBounds.top;
     } else {
       // We don't have a sibling whose position we can use. First, let's see
       // if we're also the first item (which complicates things):
       let firstNode = this._firstInRow(aNode);
       if (aNode == firstNode) {
-        // Maybe we stored the horizontal distance between non-wide nodes,
+        // Maybe we stored the horizontal distance between nodes,
         // if not, we'll use the width of the incoming node as a proxy:
         xDiff = this._horizontalDistance || aSize.width;
       } else {
         // If not, we should be able to get the distance to the previous node
         // and use the inverse, unless there's no room for another node (ie we
         // are the last node and there's no room for another one)
         xDiff = this._moveNextBasedOnPrevious(aNode, nodeBounds, firstNode);
       }

deleted file mode 100644
--- a/browser/components/customizableui/PanelWideWidgetTracker.jsm
+++ /dev/null
@@ -1,172 +0,0 @@
-/* This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
-
-"use strict";
-const {classes: Cc, interfaces: Ci, utils: Cu, results: Cr} = Components;
-
-this.EXPORTED_SYMBOLS = ["PanelWideWidgetTracker"];
-
-Cu.import("resource://gre/modules/XPCOMUtils.jsm");
-XPCOMUtils.defineLazyModuleGetter(this, "CustomizableUI",
-  "resource:///modules/CustomizableUI.jsm");
-
-var gPanel = CustomizableUI.AREA_PANEL;
-// We keep track of the widget placements for the panel locally:
-var gPanelPlacements = [];
-
-// All the wide widgets we know of:
-var gWideWidgets = new Set();
-// All the widgets we know of:
-var gSeenWidgets = new Set();
-
-var PanelWideWidgetTracker = {
-  // Listeners used to validate panel contents whenever they change:
-  onWidgetAdded(aWidgetId, aArea, aPosition) {
-    if (aArea == gPanel) {
-      gPanelPlacements = CustomizableUI.getWidgetIdsInArea(gPanel);
-      let moveForward = this.shouldMoveForward(aWidgetId, aPosition);
-      this.adjustWidgets(aWidgetId, moveForward);
-    }
-  },
-  onWidgetMoved(aWidgetId, aArea, aOldPosition, aNewPosition) {
-    if (aArea == gPanel) {
-      gPanelPlacements = CustomizableUI.getWidgetIdsInArea(gPanel);
-      let moveForward = this.shouldMoveForward(aWidgetId, aNewPosition);
-      this.adjustWidgets(aWidgetId, moveForward);
-    }
-  },
-  onWidgetRemoved(aWidgetId, aPrevArea) {
-    if (aPrevArea == gPanel) {
-      gPanelPlacements = CustomizableUI.getWidgetIdsInArea(gPanel);
-      this.adjustWidgets(aWidgetId, false);
-    }
-  },
-  onWidgetReset(aWidgetId) {
-    gPanelPlacements = CustomizableUI.getWidgetIdsInArea(gPanel);
-  },
-  // Listener to keep abreast of any new nodes. We use the DOM one because
-  // we need access to the actual node's classlist, so we can't use the ones above.
-  // Furthermore, onWidgetCreated only fires for API-based widgets, not for XUL ones.
-  onWidgetAfterDOMChange(aNode, aNextNode, aContainer) {
-    if (!gSeenWidgets.has(aNode.id)) {
-      if (aNode.classList.contains(CustomizableUI.WIDE_PANEL_CLASS)) {
-        gWideWidgets.add(aNode.id);
-      }
-      gSeenWidgets.add(aNode.id);
-    }
-  },
-  // When widgets get destroyed, we remove them from our sets of stuff we care about:
-  onWidgetDestroyed(aWidgetId) {
-    gSeenWidgets.delete(aWidgetId);
-    gWideWidgets.delete(aWidgetId);
-  },
-  shouldMoveForward(aWidgetId, aPosition) {
-    let currentWidgetAtPosition = gPanelPlacements[aPosition + 1];
-    let rv = gWideWidgets.has(currentWidgetAtPosition) && !gWideWidgets.has(aWidgetId);
-    // We might now think we can move forward, but for that we need at least 2 more small
-    // widgets to be present:
-    if (rv) {
-      let furtherWidgets = gPanelPlacements.slice(aPosition + 2);
-      let realWidgets = 0;
-      if (furtherWidgets.length >= 2) {
-        while (furtherWidgets.length && realWidgets < 2) {
-          let w = furtherWidgets.shift();
-          if (!gWideWidgets.has(w) && this.checkWidgetStatus(w)) {
-            realWidgets++;
-          }
-        }
-      }
-      if (realWidgets < 2) {
-        rv = false;
-      }
-    }
-    return rv;
-  },
-  adjustWidgets(aWidgetId, aMoveForwards) {
-    if (this.adjusting) {
-      return;
-    }
-    this.adjusting = true;
-    let widgetsAffected = gPanelPlacements.filter((w) => gWideWidgets.has(w));
-    // If we're moving the wide widgets forwards (down/to the right in the panel)
-    // we want to start with the last widgets. Otherwise we move widgets over other wide
-    // widgets, which might mess up their order. Likewise, if moving backwards we should start with
-    // the first widget and work our way down/right from there.
-    let compareFn = aMoveForwards ? ((a, b) => a < b) : ((a, b) => a > b);
-    widgetsAffected.sort((a, b) => compareFn(gPanelPlacements.indexOf(a),
-                                             gPanelPlacements.indexOf(b)));
-    for (let widget of widgetsAffected) {
-      this.adjustPosition(widget, aMoveForwards);
-    }
-    this.adjusting = false;
-  },
-  // This function is called whenever an item gets moved in the menu panel. It
-  // adjusts the position of widgets within the panel to prevent "gaps" between
-  // wide widgets that could be filled up with single column widgets
-  adjustPosition(aWidgetId, aMoveForwards) {
-    // Make sure that there are n % columns = 0 narrow buttons before the widget.
-    let placementIndex = gPanelPlacements.indexOf(aWidgetId);
-    let prevSiblingCount = 0;
-    let fixedPos = null;
-    while (placementIndex--) {
-      let thisWidgetId = gPanelPlacements[placementIndex];
-      if (gWideWidgets.has(thisWidgetId)) {
-        continue;
-      }
-      let widgetStatus = this.checkWidgetStatus(thisWidgetId);
-      if (!widgetStatus) {
-        continue;
-      }
-      if (widgetStatus == "public-only") {
-        fixedPos = !fixedPos ? placementIndex : Math.min(fixedPos, placementIndex);
-        prevSiblingCount = 0;
-      } else {
-        prevSiblingCount++;
-      }
-    }
-
-    if (fixedPos !== null || prevSiblingCount % CustomizableUI.PANEL_COLUMN_COUNT) {
-      let desiredPos = (fixedPos !== null) ? fixedPos : gPanelPlacements.indexOf(aWidgetId);
-      let desiredChange = -(prevSiblingCount % CustomizableUI.PANEL_COLUMN_COUNT);
-      if (aMoveForwards && fixedPos == null) {
-        // +1 because otherwise we'd count ourselves:
-        desiredChange = CustomizableUI.PANEL_COLUMN_COUNT + desiredChange + 1;
-      }
-      desiredPos += desiredChange;
-      CustomizableUI.moveWidgetWithinArea(aWidgetId, desiredPos);
-    }
-  },
-
-  /*
-   * Check whether a widget id is actually known anywhere.
-   * @returns false if the widget doesn't exist,
-   *          "public-only" if it's not shown in private windows
-   *          "real" if it does exist and is shown even in private windows
-   */
-  checkWidgetStatus(aWidgetId) {
-    let widgetWrapper = CustomizableUI.getWidget(aWidgetId);
-    // This widget might not actually exist:
-    if (!widgetWrapper) {
-      return false;
-    }
-    // This widget might still not actually exist:
-    if (widgetWrapper.provider == CustomizableUI.PROVIDER_XUL &&
-        widgetWrapper.instances.length == 0) {
-      return false;
-    }
-
-    // Or it might only be there some of the time:
-    if (widgetWrapper.provider == CustomizableUI.PROVIDER_API &&
-        widgetWrapper.showInPrivateBrowsing === false) {
-      return "public-only";
-    }
-    return "real";
-  },
-
-  init() {
-    // Initialize our local placements copy and register the listener
-    gPanelPlacements = CustomizableUI.getWidgetIdsInArea(gPanel);
-    CustomizableUI.addListener(this);
-  },
-};

--- a/browser/themes/shared/customizableui/customizeMode.inc.css
+++ b/browser/themes/shared/customizableui/customizeMode.inc.css
@@ -198,26 +198,28 @@ toolbarpaletteitem[notransition].panel-c
 toolbarpaletteitem[notransition][place="toolbar"],
 toolbarpaletteitem[notransition][place="palette"],
 toolbarpaletteitem[notransition][place="panel"] {
   transition: none;
 }
 
 toolbarpaletteitem > toolbarbutton > .toolbarbutton-icon,
 toolbarpaletteitem > toolbarbutton > .toolbarbutton-badge-stack > .toolbarbutton-icon,
-toolbarpaletteitem > toolbaritem.panel-wide-item {
+toolbarpaletteitem > #search-container,
+toolbarpaletteitem > toolbaritem.toolbaritem-combined-buttons {
   transition: transform var(--drag-drop-transition-duration) cubic-bezier(.6, 2, .75, 1.5) !important;
 }
 
 toolbarpaletteitem[mousedown] > toolbarbutton > .toolbarbutton-icon,
 toolbarpaletteitem[mousedown] > toolbarbutton > .toolbarbutton-badge-stack > .toolbarbutton-icon {
   transform: scale(1.3);
 }
 
-toolbarpaletteitem[mousedown] > toolbaritem.panel-wide-item {
+toolbarpaletteitem[mousedown] > #search-container,
+toolbarpaletteitem[mousedown] > toolbaritem.toolbaritem-combined-buttons {
   transform: scale(1.1);
 }
 
 /* Override the toolkit styling for items being dragged over. */
 toolbarpaletteitem[place="toolbar"] {
   border-left-width: 0;
   border-right-width: 0;
   margin-right: 0;