diff --git a/layout/xul/nsMenuPopupFrame.cpp b/layout/xul/nsMenuPopupFrame.cpp
index 3170e4197f6b..66874ced72fd 100644
--- a/layout/xul/nsMenuPopupFrame.cpp
+++ b/layout/xul/nsMenuPopupFrame.cpp
@@ -1003,13 +1003,10 @@ nsMenuPopupFrame::SlideOrResize(nscoord& aScreenPoint, nscoord aSize,
 {
   // The popup may be positioned such that either the left/top or bottom/right
   // is outside the screen - but never both.
-  if (aScreenPoint < aScreenBegin) {
-    *aOffset = aScreenBegin - aScreenPoint;
-    aScreenPoint = aScreenBegin;
-  } else if (aScreenPoint + aSize > aScreenEnd) {
-    *aOffset = aScreenPoint + aSize - aScreenEnd;
-    aScreenPoint = std::max(aScreenEnd - aSize, 0);
-  }
+  nscoord newPos =
+    std::max(aScreenBegin, std::min(aScreenEnd - aSize, aScreenPoint));
+  *aOffset = newPos - aScreenPoint;
+  aScreenPoint = newPos;
   return std::min(aSize, aScreenEnd - aScreenPoint);
 }
 
diff --git a/toolkit/content/widgets/popup.xml b/toolkit/content/widgets/popup.xml
index da106803027a..19da8b3ed17c 100644
--- a/toolkit/content/widgets/popup.xml
+++ b/toolkit/content/widgets/popup.xml
@@ -380,17 +380,16 @@
         var position = this.alignmentPosition;
         var offset = this.alignmentOffset;
         // if this panel has a "sliding" arrow, we may have previously set margins...
-        arrowbox.style.removeProperty("margin");
+        arrowbox.style.removeProperty("transform");
         if (position.indexOf("start_") == 0 || position.indexOf("end_") == 0) {
           container.orient = "";
           arrowbox.orient = "vertical";
           if (position.indexOf("_after") > 0) {
             arrowbox.pack = "end";
-            arrowbox.style.marginBottom = offset + "px";
           } else {
             arrowbox.pack = "start";
-            arrowbox.style.marginTop = offset + "px";
           }
+          arrowbox.style.transform = "translate(0, " + -offset + "px)";
 
           // The assigned side stays the same regardless of direction.
           var isRTL = (window.getComputedStyle(this).direction == "rtl");
@@ -409,11 +408,10 @@
           arrowbox.orient = "";
           if (position.indexOf("_end") > 0) {
             arrowbox.pack = "end";
-            arrowbox.style.marginRight = this.alignmentOffset + "px";
           } else {
             arrowbox.pack = "start";
-            arrowbox.style.marginLeft = this.alignmentOffset + "px";
           }
+          arrowbox.style.transform = "translate(" + -offset + "px, 0)";
 
           if (position.indexOf("before_") == 0) {
             container.dir = "reverse";